小程序交易保障标展示组件为例
1. manifest.json:
先打开manifest.json文件,然后我们找到"mp-weixin",引入需要使用的插件
"mp-weixin": {
/* 微信小程序特有相关 */
"appid": "",
"setting": {
"urlCheck": false
},
"usingComponents": true,
"plugins": {
"shoppingGuarantee": {
"version": "latest",
"provider": "wxd65104595293601e"
}
}
},
2. pages.json
打开pages.json文件,然后再对应的页面配置处添加东西
{
"path": "xxx",
"name": "xxx",
"style": {
"mp-weixin": {//微信插件
"usingComponents": {
"guarantee-bar": "plugin://shoppingGuarantee/guarantee-bar"
}
}
}
}
3.页面使用
<template>
<guarantee-bar :pageType="pageType" :goodsName="goodsName" :goodsImg="goodsImg" :align="align" :spaceSize="spaceSize" :goodsPrice="goodsPrice" :bannerStyle="bannerStyle" />
</template>
<script>
export default {
data(){
return {
align: 'between',
spaceSize: 12,
bannerStyle: {
fontSize: 'normal',
fontOpacity: 'gray',
},
pageType: 'goods_detail',
goodsName: '微信气泡狗零钱包',
goodsImg: 'https://xxxxx/',
goodsPrice: '28元'
}
}
}
</script>