在开发微信小程序的页面中如何通过点击按钮来填写任务信息并添加到当前页面中而且使它展现出来详细写出其代码
首先,在wxml文件中添加按钮和任务信息展示区域:
<view class="container">
<button bindtap="addTask">添加任务</button>
<view class="task-list">
<block wx:for="{{tasks}}" wx:key="index">
<view class="task-item">{{item}}</view>
</block>
</view>
</view>
其中,按钮绑定了一个addTask方法,用来添加任务;任务信息使用wx:for和wx:key来遍历tasks数组,并展示出来。
接着,在js文件中定义addTask方法,用来添加任务信息:
Page({
data: {
tasks: []
},
addTask: function() {
var task = "新任务";
var tasks = this.data.tasks;
tasks.push(task);
this.setData({
tasks: tasks
});
}
})
其中,data中定义了一个tasks数组,用来存储任务信息;addTask方法中,先定义一个新的任务信息,然后将它添加到tasks数组中,最后调用setData方法更新页面数据。
这样,点击按钮后就可以添加新的任务信息,并展示在页面中了
原文地址: https://www.cveoy.top/t/topic/eFAy 著作权归作者所有。请勿转载和采集!