uniapp使用代碼塊創建組件模板

uniapp使用代碼塊創建組件模板

HBuilderX將 uni-app 常用代碼封裝成了以 u 開頭的代碼塊，如在 template 標籤內輸入 ulist 回車，會自動生成如下代碼：

通過點擊介紹-高效開發技巧可以看到如下使用代碼塊創建的組件模板

<view class="uni-list">
    <view class="uni-list-cell">
        <view class="uni-list-cell-navigate uni-navigate-right" v-for="(item,index) in list" :key="index">
            {{item.value}}
        </view>
    </view>
</view>

hbuilder具體操作步驟

進入hbuilderX菜單 工具-代碼塊設置-vue代碼塊，然後在右邊輸入以下代碼，最後保存重開hbuilderX後進入輸入ulist即可。

	"ulist": {
		"body": [
"<view class=\"uni-list\">",
	"\t<view class=\"uni-list-cell\">",
			"\t\t<view class=\"uni-list-cell-navigate uni-navigate-right\">",
			"\t\t\t例子",
			"\t\t</view>",
	"\t</view>",
"</view>"
		],
		"prefix": "ulist",
		"project": "uni-app",
		"scope": "source.vue.html"
	}