uniapp uses native plug-ins (components) provided by WeChat applets

Take the display component of the Mini Program Transaction Guarantee as an example

Refer to uniapp loading plug-in , WeChat applet loading plug-in

1. manifest.json:

First open the manifest.json file, then we find "mp-weixin" and import the plug-ins that need to be used

"mp-weixin": {
    
    
		/* 微信小程序特有相关 */
		"appid": "",
		"setting": {
    
    
			"urlCheck": false
		},
		"usingComponents": true,
    "plugins": {
    
    
      "shoppingGuarantee": {
    
    
        "version": "latest",
        "provider": "wxd65104595293601e"
      }
    }
	},

2. pages.json

Open the pages.json file, and then add something to the corresponding page configuration

 {
    
    
          "path": "xxx",
          "name": "xxx",
          "style": {
    
    
          "mp-weixin": {
    
    //微信插件
			  "usingComponents": {
    
    
                "guarantee-bar": "plugin://shoppingGuarantee/guarantee-bar"
              }
			}   
          }
}

3. Page usage

<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>