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


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 相关文章推荐
js单向链表的具体实现实例
Jun 21 Javascript
JS实现响应鼠标点击动画渐变弹出层效果代码
Mar 25 Javascript
在Web项目中引入Jquery插件报错的完美解决方案(图解)
Sep 19 Javascript
jquery实现多次上传同一张图片
Jan 09 Javascript
vue+swiper实现组件化开发的实例代码
Oct 26 Javascript
如何利用@angular/cli V6.0直接开发PWA应用详解
May 06 Javascript
vue中的$emit 与$on父子组件与兄弟组件的之间通信方式
May 13 Javascript
JavaScript实现简单音乐播放器
Apr 17 Javascript
如何在Vue.js中实现标签页组件详解
Jan 02 Javascript
如何基于javascript实现贪吃蛇游戏
Feb 09 Javascript
JavaScript中while循环的基础使用教程
Aug 11 Javascript
详谈Vue.js框架下main.js,App.vue,page/index.vue之间的区别
Aug 12 Javascript
微信小程序实现同一页面取值的方法分析
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
2020最新CPU的性能排名
2020/04/02 数码科技
phpwind中的数据库操作类
2007/01/02 PHP
php 批量添加多行文本框textarea一行一个
2014/06/03 PHP
教你在PHPStorm中配置Xdebug
2015/07/27 PHP
PHP CURL或file_get_contents获取网页标题的代码及两者效率的稳定性问题
2015/11/30 PHP
关于php支持的协议与封装协议总结(推荐)
2017/11/17 PHP
Laravel框架路由和控制器的绑定操作方法
2018/06/12 PHP
Laravel 修改默认日志文件名称和位置的例子
2019/10/17 PHP
二级域名或跨域共享Cookies的实现方法
2008/08/07 Javascript
Jquery 滑入滑出效果实现代码
2010/03/27 Javascript
JS中类或对象的定义说明
2014/03/10 Javascript
js,jquery滚动/跳转页面到指定位置的实现思路
2014/06/03 Javascript
JQuery实现展开关闭层的方法
2015/02/17 Javascript
jQuery实现在textarea指定位置插入字符或表情的方法
2015/03/11 Javascript
JS实现可直接显示网页代码运行效果的HTML代码预览功能实例
2015/08/06 Javascript
使用JavaScript为Kindeditor自定义按钮增加Audio标签
2016/03/18 Javascript
详解Jquery实现ready和bind事件
2016/04/14 Javascript
浅谈jquery的map()和each()方法
2016/06/12 Javascript
加载 vue 远程代码的组件实例详解
2017/11/20 Javascript
React 使用recharts实现散点地图的示例代码
2018/12/07 Javascript
vue 中url 链接左边的小图标更改问题
2019/12/30 Javascript
在vue中使用inheritAttrs实现组件的扩展性介绍
2020/12/07 Vue.js
详细解读Python中的__init__()方法
2015/05/02 Python
Python中的深拷贝和浅拷贝详解
2015/06/03 Python
Python使用min、max函数查找二维数据矩阵中最小、最大值的方法
2018/05/15 Python
Python带动态参数功能的sqlite工具类
2018/05/26 Python
pandas 将list切分后存入DataFrame中的实例
2018/07/03 Python
python提取包含关键字的整行数据方法
2018/12/11 Python
对pandas读取中文unicode的csv和添加行标题的方法详解
2018/12/12 Python
解决Python3 被PHP程序调用执行返回乱码的问题
2019/02/16 Python
Python读取Excel数据并生成图表过程解析
2020/06/18 Python
Python中过滤字符串列表的方法
2020/12/22 Python
HTML5新特性之type=file文件上传功能
2018/02/02 HTML / CSS
受欢迎的大学生自我评价
2013/12/05 职场文书
大专生找工作自荐书
2014/06/10 职场文书
ajax请求前端跨域问题原因及解决方案
2021/10/16 Javascript