小程序:radio实现勾选显示隐藏页面文本显示:附代码

先看实现效果:

小程序:radio实现勾选显示隐藏页面文本显示:附代码_第1张图片

代码:

wxml:


  
    
      {{item.text}}
    
  
  
    
      {{item.text}}
    
  
  
    
      {{item.text}}
    
  







新建pages1页:pages2页,pages3页 ,直接在同个文件夹下新建wxml即可!

pages1:wxml


  
    
      pages1
            这是pages1页,点击勾选pages1显示
    
  

pages2:wwxml


  
    
      pages2
            这是pages2页,点击勾选pages2显示
    
  

pages3:wwxml


  
    
      pages3
            这是pages3页,点击勾选pages3显示
    
  

js:

Page({
  data: {
    pageone: [{
      name: 'pages1',
      text: 'pages1',
      checked: false
    }],
    pagetwo: [{
      name: 'pages2',
      text: 'pages2',
      checked: false
    }],
    pagethree: [{
      name: 'pages3',
      text: 'pages3',
      checked: false
    }],
  },
  // 获取value的值
  radioChange1: function (e) {
    let pages1 = e.detail.value;
    this.setData({
      seleted: "选中的value:" + pages1
    })
    console.log('radio发生change事件,携带value值为:', e.detail.value)
  },
  bindtap1: function (e) {
    var newpage = this.data.pageone; /*获取brand数组*/
    newpage[0].checked = !(newpage[0].checked);
    this.setData({
      pageone: newpage
    });
    console.log('newpage', newpage)
  },

  radioChange2: function (e) {
    let pages2 = e.detail.value;
    this.setData({
      seleted: "选中的value:" + pages2
    })
    console.log('radio发生change事件,携带value值为:', e.detail.value)
  },
  bindtap2: function (e) {
    var newpage = this.data.pagetwo; /*获取brand数组*/
    newpage[0].checked = !(newpage[0].checked);
    this.setData({
      pagetwo: newpage
    });
    console.log('newpage', newpage)
  },

  radioChange3: function (e) {
    let pages3 = e.detail.value;
    this.setData({
      seleted: "选中的value:" + pages3
    })
    console.log('radio发生change事件,携带value值为:', e.detail.value)
  },
  bindtap3: function (e) {
    var newpage = this.data.pagethree; /*获取brand数组*/
    newpage[0].checked = !(newpage[0].checked);
    this.setData({
      pagethree: newpage
    });
    console.log('newpage', newpage)
  },
})

有问题,多指教!

你可能感兴趣的:(小程序:radio实现勾选显示隐藏页面文本显示:附代码)