微信小程序常用赋值方法小结
本文实例讲述了微信小程序常用赋值方法。分享给大家供大家参考,具体如下:
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; }
希望本文所述对大家微信小程序开发有所帮助。
相关推荐
-
微信小程序 两种为对象属性赋值的方式详解
微信小程序两种为对象属性赋值的方式 对应config.wxml <view> 阶段一<switch id="config1" checked bindchange="switchChange"/> </view> 对应config.js data:{ //定义对象 configs:{} } //方式一 switchChange:function(e){ //为对象的某一属性赋值 configs.config1={ }; conso
-
微信小程序 wx.request(接口调用方式)详解及实例
微信小程序 wx.request----接口调用方式 最近开发了一个微信小程序版的任务管理系统,在向Java后台发送接口时遇到了一些问题,在这里做一个简单的总结. 官方接口 官方给出的接口叫做wx.request,请求方式比较简单,下面是官网给出的请求实例. wx.request({ url: 'test.php', //仅为示例,并非真实的接口地址 data: { x: '' , y: '' }, header: { 'content-type': 'application/json' },
-
微信小程序 调用远程接口 给全局数组赋值代码实例
关键是 let that = this 因为在onLoad 的 wx.request方法里, this指的是 wx.request 的上下文, 所以应该是在 onLoad 的时候定义 let that = this 调用远程服务,序列化后,把obj赋值给bookList 最开始的报错代码如下: Page({ data: { bookList: [] }, onLoad: function() { wx.request({ url: 'https://jiashubing.cn/wechat/bo
-
微信小程序如何调用json数据接口并解析
开始写js,用request请求接口url,当请求成功的时候,在控制台打印一下返回的res.data数据,在控制台可以看到打印了接口数据了,在请求接口成功之后,用setData接收数据,并且需在data中声明一个接收数据的变量. Page({ data: { list: [] }, onLoad: function (options) { wx.request({ url: 'https://c.y.qq.com/v8/fcg-bin/fcg_v8_toplist_cp.fcg?g_tk=538
-
微信小程序调用天气接口并且渲染在页面过程详解
前两天写了关于组件库 iView Weapp的教程,其实也就是把文档上的例子拿出来体验了一遍,今天写一个具体的例子,调用一个免费的天气接口的api,并且把所获取的内容展示在前端的界面,前端界面与 iView Weapp结合,展示的一个小的demo. 先上效果 开始写代码: 1:找打一个免费的天气接口 免费接口api: https://www.apiopen.top/api.html#top https://www.apiopen.top/weatherApi?city=%E4%B8%8A%E6%
-
微信小程序调用PHP后台接口 解析纯html文本
微信小程序调用PHP后台接口,解析纯html文本,效果图片预览 1.微信js动态传参: wx.request({ url: 'https://m.****.com/index.php/Home/Xiaoxxf/activity_detail?a_id='+options.id,//含富文本html data: { is_detail:1 }, method: 'GET', // OPTIONS, GET, HEAD, POST, PUT, DELETE, TRACE, CONNECT heade
-
微信小程序常用赋值方法小结
本文实例讲述了微信小程序常用赋值方法.分享给大家供大家参考,具体如下: 1.微信小程序将值赋值给局部变量: "=" 实例: var name=options.goodsName 2.微信小程序将值赋值给全局变量: "=" 或 this.setData({ }) 实例: this.data.goodName=options.goodsName this.setData({ goodName: options.goodsName }) 3.微信小程序将局部变量赋值给全局
-
微信小程序 setData使用方法及常用错误解决办法
微信小程序 setData使用方法及常用错误解决办法 最近在弄微信小程序,类似于共享单车用来练练手,基本原理就是小程序发送经纬度给服务器,服务器从数据库中检索经纬度附近的单车传给小程序. 就在这里..没错就是这里,传回来的值是以jsonarray格式传过来的. 我需要将jsonarray进行解析获取经纬度,ID等车辆信息,然后赋值给小程序地图上的mark,一般我的思路时直接用个for循环给每个mark进行赋值然后再Setdata一下就ok, 结果没想到小程序setData()设置数组对象的某个元
-
微信小程序常用功能实例汇总包括上拉刷新,下拉加载,列表数据绑定,轮播,参数传递
微信小程序 getApp() 方法 小程序提供了全局的 getApp() 方法,可获取当前小程序实例,一般用于在子页面中获取顶层应用. // app.js App({ globalData: 1 }); // page.js var app = getApp(); console.log(app.globalData); // 获取 globalData 一 整体结构 图片目录(images).页面目录(pages).公共脚本(utils).全局配置(app.json.project.confi
-
微信小程序常用简易小函数总结
本文实例讲述了微信小程序常用简易小函数.分享给大家供大家参考,具体如下: 最近一直在写微信小程序,而且由于是第二次写了,所以针对很多通用的情况封装了一些函数,建议你们放在app.js中,方便全局去调用. 提示类函数 微信有一种原生的API用于显示提示类结果的wx.showToast,而且其中的图片是可以自定义的,所以为了保证全部一致性,而且方便调用,所以我将其全部封装在了app.js中: // 成功 showSuccess: function (message) { wx.showToast({
-
VUE 组件转换为微信小程序组件的方法
简介: 首先我们介绍一下本文的关键点:抽象语法树,它是以树状的形式表现编程语言的语法结构,树上的每个节点都表示源代码中的一种结构. 通过操作这棵树,可以精确的定位到声明.赋值.运算语句,从而实现对代码的优化.变更等操作. 本文通过对 VUE 组件的 JavaScript .CSS模块进行转换,比如 JavaScript模块,包括外层对象,生命周期钩子函数,赋值语句,组件的内部数据,组件的对外属性等等来实现把一个 VUE 组件转换为 一个小程序组件. AST 抽象语法树,似乎我们平时并不会接触到.
-
微信小程序中post方法与get方法的封装
微信小程序开发post方法与get方法的封装 第一步:在utils文件夹下创建httpUtil.js文件 第二步:创建函数httpPost方法代码如下: function Post(url, data, cb, isShow, showNetError, that, showLoading) { if (showLoading == true || showLoading == undefined){ wx.showNavigationBarLoading(); wx.showLoading({
-
微信小程序 wx.request方法的异步封装实例详解
wx-promise-request 是对微信小程序 wx.request 方法的异步封装. 解决问题 支持 Promise (使用 es6-promise 库). 管理请求队列,解决 request 最大并发数超过 10 会报错的问题. 下载 npm install wx-promise-request 然后拷贝 dist/index.js 文件到你的小程序项目中. 使用 import {request} from './wx-promise-request'; request({ url:
-
微信小程序 MD5的方法详解及实例代码
微信小程序 MD5的方法详解 生成的文件可以放在 utils文件中哦!!! /* * A JavaScript implementation of the RSA Data Security, Inc. MD5 Message * Digest Algorithm, as defined in RFC 1321. * Version 1.1 Copyright (C) Paul Johnston 1999 - 2002. * Code also contributed by Greg Holt
-
微信小程序 常用工具类详解及实例
微信小程序 常用工具类详解 前言: 做微信小程序当中,会遇到好多的工具类util.js,这里记载下来以便平常使用 (Ps:建议通过目录查看) -获取日期(格式化) function formatTime(date) { var year = date.getFullYear() var month = date.getMonth() + 1 var day = date.getDate() var hour = date.getHours() var minute = date.getMinut
-
微信小程序常用视图容器组件使用详解
目录 1.组件概述 2.常用的试图容器组件 2.1view 2.2scroll-view 2.3swiper 1.组件概述 组件是视图层基本的组成单元,具备UI风格样式以及特定的功能效果.当打开某款小程序之后,界面中的图片.文字等元素都需要使用组件,小程序组件使用灵活,组件之间通过相互嵌套进行界面设计,开发者可以通过组件的选择和样式属性设计出不同的界面效果.一个组件包括开始标签和结束标签,属性用来装饰这个组件的样式. 其语法格式如下: <标签名称 属性="值">内容<
随机推荐
- MySQL中describe命令的使用方法小结
- JS 面向对象之神奇的prototype
- java IO 字节流详解及实例代码
- 使用UItableview在iOS应用开发中实现好友列表功能
- C#多线程Singleton(单件)模式模板
- 基于JS判断iframe是否加载成功的方法(多种浏览器)
- .NET微信公众号开发之查询自定义菜单
- JS正则匹配中文的方法示例
- GET 方式提交的含有特殊字符的参数
- java发送短信系列之限制日发送次数
- linux云主机安装pdo详细教程
- SQLServer分布式事务问题
- 列出SQL Server中具有默认值的所有字段的语句
- Sql Server 查询性能优化之走出索引的误区分析
- jQuery+HTML5美女瀑布流布局实现方法
- jQuery插件multiScroll实现全屏鼠标滚动切换页面特效
- javascript 开发之百度地图使用到的js函数整理
- 站长质疑20click.com广告经营方式
- java连接Oracle数据库的方法解析
- Java overload和override的区别分析