您的位置:首页 > 移动开发 > 微信开发

微信小程序template模板传值、传方法

2018-08-04 17:15 127 查看
版权声明: https://blog.csdn.net/u013525792/article/details/81412872

小程序入手初期,没有接触组件开发的时候,一般先上手的都是模板开发,也就是小程序文档中的template部分,

它可以让我们模板中定义代码片段,然后在不同的地方调用。

template比较麻烦的就是在调用的时候要分别导入wxml代码和wxss

先说一下一下数据的导入:在页面js文件中定好数据

[code]Page({
data: {
pageData:{
scrollHeight:null,
navStep: "option"
}
}
})

在页面的template标签中可以直接导入

[code]A:
<template is="gemSelectColor" data="{{optionData}}" />
B:
<template is="gemSelectColor" data="{{...optionData}}" />

A:导入对象后可以在模板中按照对点打点调用的方式待用数据

B:传入的数据已经被展开,可以直接书写对象的属性来拿到对象中的值,这点熟悉es6的同学都会很清楚

我主要想说的是模板中绑定事件的方式:

[code]asd:function(){
let _data = pageData;
_data.click_next = "tmp_clickNext";
this.setData({
pageData:_data
})
},
tmp_clickNext:function(){
console.log("执行了模板中的函数")
},

接下来在模板中绑定该事件即可

[code]<template is="xxxx" data="{{pageData}}">
<view bind:tap="{{pagedata.click_next}}">模板点击事件<view>
</template>

这样我们点击模板中的对于那个元素就可以调用方法了。

阅读更多
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: