65、意见反馈_引入tabs组件
在个人中心给意见反馈添加超链接——>跳转到意见反馈
pages\user\index.wxml
<navigator url="/pages/feedback/index" class="app_info_item">意见反馈</navigator>
微信小程序内置_意见反馈
引入tabs组件及功能的实现(仿照商品列表页面)
pages\goods_list\index.json——>pages\feedback\index.json
{
"usingComponents": {
"Tabs":"../../components/Tabs/Tabs"
},
"navigationBarTitleText": "意见反馈"
}
pages\goods_list\index.wxml——>pages\feedback\index.wxml
<Tabs tabs="{{tabs}}" bindtabsItemChange="handleTabsItemChange">
内容
</Tabs>
pages\goods_list\index.js——>pages/feedback/index.js
// pages/feedback/index.js
Page({
/**
* 页面的初始数据
*/
data: {
tabs:[
{
id: 0,
value:"体验问题",
isActive: true
},
{
id: 1,
value:"商品、商家投诉",
isActive: false
}
]
},
// 标题点击事件从子组件传递过来
handleTabsItemChange(e){
console.log(e);
// 1 获取被点击的标题索引
const {index}=e.detail;
// 2 修改源数组
let {tabs}=this.data;
tabs.forEach((v,i)=>i===index?v.isActive=true:v.isActive=false);
// 3 赋值到data中
this.setData({
tabs
})
}
})