这是我参与11月更文挑战的第27天,活动详情查看:2021最后一次更文挑战
1. 微信小程序之间的跳转
想在微信小程序内通过绑定事件跳转到另外一个小程序,查看了微信开放文档( wx.navigateToMiniProgram) 按照官网的流程写完后发现报错:invalied appid(无效的appid),
此时需要你将要跳转到的小程序的appid添加到白名单中,官网的示例并没有说明这个
这是我的跳转小程序的代码
wx.navigateToMiniProgram({
appId: 'wx38cd529850225d76',
navigateToMiniProgramAppIdList : ["wx38cd529850225d76"],
// path: 'pages/game_query/game_query',
// extraData: {
// foo: 'bar'
// },
// envVersion: 'develop',
success(res) {
console.log(res);
},
fail(res)
{
console.log(res);
}
})
1 .navigateToMiniProgramAppIdList属性就是白名单,值是数组,你要跳转到哪个小程序,就把那个小程序的appid添加到数组中
2. path:就是要跳转到小程序的哪个页面
3. extraData:需要传递给目标小程序的数据,目标小程序可在 App.onLaunch,App.onShow 中获取到这份数据。如果跳转的是小游戏,可以在 wx.onShow、wx.getLaunchOptionsSync 中可以获取到这份数据数据。
4. enVersion:要打开的小程序版本。仅在当前小程序为开发版或体验版时此参数有效。如果当前小程序是正式版,则打开的小程序必定是正式版。
2. 微信小程序vantweapp组件库toast组件使用
vantweapp官网对toast组件的使用说明并不详细,按照官网的用法,页面是不能调用成功的,下面是成功的方法
//1,json文件引入
"usingComponents": {
"van-toast": "/miniprogram_npm/@vant/weapp/toast"
},
//2,xx.wxml文件引入
<van-toast id="van-toast" />
//3,xx.js文件引入组件
import Toast from '../../miniprogram_npm/@vant/weapp/toast/toast';
//4,使用组件
onLoad: function (options) {
Toast('我是提示文案,建议不超过十五字~');
},
3. 微信小程序双向绑定语法
在 WXML 中,普通的属性的绑定是单向的。例如:
<input value="{{value}}" />
如果使用 this.setData({ value: 'leaf' }) 来更新 value ,this.data.value 和输入框的中显示的值都会被更新为 leaf ;但如果用户修改了输入框里的值,却不会同时改变 this.data.value 。
如果需要在用户输入的同时改变 this.data.value ,需要借助简易双向绑定机制。此时,可以在对应项目之前加入 model: 前缀:
<input model:value="{{value}}" />
这样,如果输入框的值被改变了, this.data.value 也会同时改变。同时, WXML 中所有绑定了 value 的位置也会被一同更新, 数据监听器 也会被正常触发。
用于双向绑定的表达式有如下限制:
只能是一个单一字段的绑定,如一下都是无效的;
<input model:value="值为 {{value}}" />
<input model:value="{{ a + b }}" />
目前,尚不能 data 属性,如一下也是无效的
<input model:value="{{ a.b }}" />