微信小程序switch开关选择器如何用-创新互联

本文小编为大家详细介绍“微信小程序switch开关选择器如何用”,内容详细,步骤清晰,细节处理妥当,希望这篇“微信小程序switch开关选择器如何用”文章能帮助大家解决疑惑,下面跟着小编的思路慢慢深入,一起来学习新知识吧。

超过十余年行业经验,技术领先,服务至上的经营模式,全靠网络和口碑获得客户,为自己降低成本,也就是为客户降低成本。到目前业务范围包括了:成都网站建设、成都做网站,成都网站推广,成都网站优化,整体网络托管,微信小程序开发,微信开发,成都app开发,同时也可以让客户的网站和网络营销和我们一样获得订单和生意!

效果图

微信小程序switch开关选择器如何用

WXML


 
  状态:{{isChecked1}}
  
 
 
  状态:{{isChecked2}}
  
 
 
  状态:{{isChecked3}}
  
 
 
  状态:{{isChecked4}}
  
 
 
  状态:{{isChecked5}}
  
 
 
  状态:{{isChecked6}}
  
 

JS

var pageObj = {
 data: {
  isChecked1: false,
  isChecked2: true,
  isChecked3: false,
  isChecked4: true,
  isChecked5: false,
  isChecked6: true
 }
};

for (var i = 0; i < 7; ++i) {
 (function (i) {
  pageObj['changeSwitch' + i] = function (e) {
   var changedData = {};
   changedData['isChecked' + i] = !this.data['isChecked' + i];
   this.setData(changedData);
  }
 })(i)
}
Page(pageObj);

switch组件的属性

  • checked:是否选中—-false、true

  • type:开关选择器的样式—-switch, checkbox

  • color:switch 的颜色,同 css 的 color

读到这里,这篇“微信小程序switch开关选择器如何用”文章已经介绍完毕,想要掌握这篇文章的知识点还需要大家自己动手实践使用过才能领会,如果想了解更多相关内容的文章,欢迎关注创新互联行业资讯频道。


当前标题:微信小程序switch开关选择器如何用-创新互联
浏览路径:http://scyanting.com/article/ijcsj.html