HBuilderX新增自定义vue代码块之ulistMedia
HBuilderX有不少vue代码块可直接调用,uListMedia不是内置的,需要新增自定义。
依次打开HBuilderX菜单:工具 -> 代码块设置 -> vue代码块,将如下粘贴在vue.json文件内,保存即可,然后在 .vue 文件中输入uli弹出ulistMedia代码块
"uListMedia": { "body": [ "<view class=\"uni-list\">", "\t<view class=\"uni-list-cell\" hover-class=\"uni-list-cell-hover\" v-for=\"(item,index) in list\" :key=\"index\">", "\t\t<view class=\"uni-media-list\">", "\t\t\t<image class=\"uni-media-list-logo\" :src=\"item.img\"></image>", "\t\t\t<view class=\"uni-media-list-body\">", "\t\t\t\t<view class=\"uni-media-list-text-top\">{{item.title}}</view>", "\t\t\t\t<view class=\"uni-media-list-text-bottom uni-ellipsis\">{{item.content}}</view>", "\t\t\t</view>", "\t\t</view>", "\t</view>", "</view>" ], "prefix": "ulistmedia", "project": "uni-app", "scope": "source.vue.html" }