189 8069 5689

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

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

公司主营业务：成都网站建设、成都网站设计、移动网站开发等业务。帮助企业客户真正实现互联网宣传，提高企业的竞争能力。创新互联公司是一支青春激扬、勤奋敬业、活力青春激扬、勤奋敬业、活力澎湃、和谐高效的团队。公司秉承以“开放、自由、严谨、自律”为核心的企业文化，感谢他们对我们的高要求，感谢他们从不同领域给我们带来的挑战，让我们激情的团队有机会用头脑与智慧不断的给客户带来惊喜。创新互联公司推出乌兰免费做网站回馈大家。

效果图

微信小程序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://cdxtjz.com/article/jdeooe.html

其他资讯