微信小程序常用赋值方法小结


Posted in Javascript onApril 30, 2019

本文实例讲述了微信小程序常用赋值方法。分享给大家供大家参考,具体如下:

1.微信小程序将值赋值给局部变量: "="

实例:

var name=options.goodsName

2.微信小程序将值赋值给全局变量: "=" 或 this.setData({ })

实例:

this.data.goodName=options.goodsName
this.setData({
goodName: options.goodsName
})

3.微信小程序将局部变量赋值给全局变量 : this.setData({ })

实例:

var name=options.goodsName
this.setData({
goodName: name
})

4.微信小程序将全局变量赋值给局部变量 :  this.data.全局变量

实例:

var name=this.data.goodName

注:仅适用于js页面

微信小程序给data的对象的属性赋值

<view wx:for="{{leixing}}">
     <button class="leixing_btn {{user_infor.lx_btn==item.divingtypeid ? 'lx_btn' : ''}}" bindtap="lx_btn_click" data-name="{{item.divingtypeid}}" id="{{item.divingtypeid}}">{{item.name}}</button>
</view>
<input class='tj_input' type="text" placeholder="请输入姓名" bindinput ="user_nameInput" name="user_name" id="name" />

js

data: {
  user_infor:{
   user_name:'',
   phone:'',
   lx_btn: 0,
  },
 }
 lx_btn_click: function (e) {
  var lx_btn = 'user_infor.lx_btn'
  var that = this;
  if (that.data.lx_btn === e.target.dataset.name) {
   return false;
  } else {
   that.setData({
     [lx_btn]: e.target.dataset.name
   })
  }
 },
 phoneInput:function(e){
  var phone = 'user_infor.phone'
  var that = this
  that.setData({
   [phone]: e.detail.value
  })
 }

css

.leixing_btn{
 font-size: 23rpx;
 display: flex; text-align:center;
 border:1px solid #eee;
 border-radius:10rpx;
 padding: 8rpx 20rpx 8rpx 20rpx;
 background-color: white;
 margin-left: 20rpx;
}
.lx_btn {
 color: red;
}

希望本文所述对大家微信小程序开发有所帮助。

Javascript 相关文章推荐
jQuery选择器简明总结(含用法实例,一目了然)
Apr 25 Javascript
AngularJS基础知识笔记之表格
May 10 Javascript
不得不分享的JavaScript常用方法函数集(上)
Dec 23 Javascript
全面理解闭包机制
Jul 11 Javascript
浅谈Javascript中的Label语句
Dec 14 Javascript
js调用刷新界面的几种方式
May 03 Javascript
Javascript中将变量转换为字符串的三种方法
Sep 19 Javascript
微信小程序实现点击按钮修改文字大小功能【附demo源码下载】
Dec 06 Javascript
详解Webpack+Babel+React开发环境的搭建的方法步骤
Jan 09 Javascript
在 Vue 项目中引入 tinymce 富文本编辑器的完整代码
May 04 Javascript
layui实现数据分页功能
Jul 27 Javascript
vue项目中openlayers绘制行政区划
Dec 24 Vue.js
微信小程序实现同一页面取值的方法分析
Apr 30 #Javascript
一百行JS代码实现一个校验工具
Apr 30 #Javascript
Vue-cli3简单使用(图文步骤)
Apr 30 #Javascript
微信小程序单选radio及多选checkbox按钮用法示例
Apr 30 #Javascript
VSCode使用之Vue工程配置eslint
Apr 30 #Javascript
微信小程序API—获取定位的详解
Apr 30 #Javascript
基于JS开发微信网页录音功能的实例代码
Apr 30 #Javascript
You might like
超人钢铁侠联手合作?美漫作家呼吁DC漫威合作联动以抵抗疫情
2020/04/09 欧美动漫
Windows中使用计划任务自动执行PHP程序实例
2014/05/09 PHP
php使用百度ping服务代码实例
2014/06/19 PHP
php 生成签名及验证签名详解
2016/10/26 PHP
可以支持多中格式的JS键盘
2007/05/02 Javascript
JQuery的html(data)方法与&amp;lt;script&amp;gt;脚本块的解决方法
2010/03/09 Javascript
基于jquery自己写tab滑动门(通用版)
2012/10/30 Javascript
js导出txt示例代码
2014/01/14 Javascript
Jquery 在页面加载后执行的几种方式
2014/03/14 Javascript
JQuery实现的购物车功能(可以减少或者添加商品并自动计算价格)
2015/01/13 Javascript
浅析JavaScript作用域链、执行上下文与闭包
2016/02/01 Javascript
javascript和jQuery实现网页实时聊天的ajax长轮询
2016/07/20 Javascript
Bootstrap模态框使用详解
2017/02/15 Javascript
Vue 拦截器对token过期处理方法
2018/01/23 Javascript
微信小程序中使用wxss加载图片并实现动画效果
2018/08/13 Javascript
基于vue-cli npm run build之后vendor.js文件过大的解决方法
2018/09/27 Javascript
vue-test-utils初使用详解
2019/05/23 Javascript
Python中反射和描述器总结
2018/09/23 Python
Python根据当前日期取去年同星期日期
2019/04/14 Python
用Python将Excel数据导入到SQL Server的例子
2019/08/24 Python
Python+OpenCV实现实时眼动追踪的示例代码
2019/11/11 Python
Python中文分词库jieba,pkusegwg性能准确度比较
2020/02/11 Python
对Keras中predict()方法和predict_classes()方法的区别说明
2020/06/09 Python
解决Python import .pyd 可能遇到路径的问题
2021/03/04 Python
HTML5+CSS3实现无插件拖拽上传图片(支持预览与批量)
2017/01/05 HTML / CSS
全球酒店比价网:HotelsCombined
2017/06/20 全球购物
澳大利亚最受欢迎的美发和美容在线商店:Catwalk
2018/12/12 全球购物
美国基督教约会网站:ChristianCafe.com
2020/02/04 全球购物
最新的大学生找工作自我评价
2013/09/29 职场文书
师范学院教师自荐书
2014/01/31 职场文书
调解协议书
2014/04/16 职场文书
领导班子自我剖析材料
2014/08/16 职场文书
2014年师德师风自我剖析材料
2014/09/27 职场文书
首次购房证明
2015/06/19 职场文书
2016年教师师德师风承诺书
2016/03/25 职场文书
maven 解包依赖项中的文件的解决方法
2022/07/15 Java/Android