微信小程序中的data和事件的用法

最新推荐文章于 2024-06-12 18:46:19 发布
最新推荐文章于 2024-06-12 18:46:19 发布
阅读量2k 收藏 1
点赞数 1
分类专栏： 微信小程序中的data用法 微信小程序事件的用法 文章标签： 微信小程序
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/mslmhl/article/details/106368028
版权

微信小程序

微信小程序为什么不存在跨域问题
跨域只存在于浏览器中，浏览器有同源策略（一个域名不能请求另一个域名中的数据。一个浏览器不能请求另一个浏览器），小程序不给予浏览器，是在微信中运行的，所以在任何地方都可以访问。
在微信小程序开发中：
1.WXML就相当于HTML
2.WXS就相当于CSS
3.小程序中推荐使用flex(弹性布局)

小程序内置文件的作用

在这里插入图片描述
在微信小程序中写代码更加方便同目录下面前缀是一致的不需要使用link引入css和script引入js。软件自动识别
在这里插入图片描述
在微信小程序的js中想要改变data的值得使用this.setData({对象:“新值”})
在这里插入图片描述
小程序的钩子函数：
在这里插入图片描述

mslmhl
关注
  • 1
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
微信小程序怎么获取到data数据？
土拨鼠博客
01-24 1万+
var text=this.data.name ，这样就获取到初始化的值 page({ data:{ name:"我叫小明" }, showData:function(){ var text = this.data.name } })
微信小程序--data的赋值与取值
热门推荐
程诺
07-07 17万+
通过小程序官方文档可知： Page() 函数用来注册一个页面。接受一个 object 参数，其指定页面的初始数据、生命周期函数、事件处理函数等。其中的参数data用来设置初始数据，WXML 中的动态数据均来自对应 Page 的 data。 所以如果页面需要显示动态数据必须要把数据更新到data中对应的变量中。 页面js文件中这么写： Page({ data: { message: '
小程序中的模版语法
最新发布
A_fork的博客
06-12 1175
小程序的数据绑定机制只能监听到 setData 方法中修改的数据，无法监听到直接删除属性的操作，所以在删除对象属性时，需要先将对象复制一份再进行操作，然后再调用 setData 方法更新数据。当数据改变触发渲染层重新渲染的时候，会校正带有 key 的组件，框架会确保他们被重新排序，而不是重新创建，以确保使组件保持自身的状态，并且。中声明对象类型的数据，小程序中通过调用 setData 方法可以修改页面的数据，包括对象类型的数据。在数组类型的数据时，可以使用 ES6 的展开运算符先复制数组，然后进行合并。
微信小程序事件，data-属性的作用
qq_44818085的博客
04-02 7719
1.微信小程序中的事件，以及为什么要用 data- 来绑定属性 原因：因为微信小程序中不能直接使用函数传参，就是用data-来绑定一个属性，进行传参 <!-- 通过 bindtap 给元素绑定事件 --> <view bindtap="SetData" data-name="mxc">按钮</view> Page({ data: { name:"" }, // 事件函数与 data 同级 SetData:function(
微信小程序setData详解&修改data数据&修改多层data数据
初心 - 杨瑞超个人博客
12-05 9167
初心-杨瑞超个人博客诚邀您加入qq群(IT-程序猿-技术交流群)：757345416 setData 函数用于将数据从逻辑层发送到视图层（异步），同时改变对应的 this.data 的值（同步）。 参数说明 字段 类型 必填 描述 版本 data Object 是 这次要改变的数据 callback Function 否 setData引起的界面更新渲染完毕后的回调函数 ...
微信小程序一个设置data数据的坑
eunicorn的博客
05-17 819
微信小程序开发data
微信小程序Page中data数据操作和函数调用方法
01-03
接受一个 object 参数，其指定页面的初始数据、生命周期函数、事件处理函数等。 //index.js Page({ data: { text: This is page data., sliderOffset: 0, sliderLeft: 0, state:{ genre:[], genre_index: 0,...
微信小程序 详解Page中data数据操作和函数调用
08-31
本文将深入探讨 `Page` 中的 `data` 数据操作和函数调用，帮助开发者更好地理解和掌握微信小程序的开发技巧。 首先，我们来看 `Page` 的基本结构。在 `index.js` 文件中，`Page` 接受一个对象参数，这个对象包含了...
微信小程序开发之改变data中数组或对象的某一属性值
08-27
在微信小程序中，我们可以使用数据绑定来实现视图和数据的关联。例如，在上面的代码中，我们使用`wx:for`指令来绑定`sDate`数组中的数据到视图中，每个项对应一个视图。使用数据绑定可以使我们的代码更加简洁和易于...
微信小程序中data-key属性之数据传输(经验总结)
10-14
在微信小程序开发中，`data-key` 属性是一种自定义属性，主要用于数据的传输和管理。这个属性在页面和组件间传递数据时起到关键作用，尤其是在处理动态数据和事件交互时。本文将深入探讨`data-key`的用法、接收方式...
微信小程序定义和调用全局变量globalData的实现
10-16
本文将详细介绍如何在微信小程序中定义和调用全局变量`globalData`。 首先，我们要明白什么是全局变量`globalData`。在编程中，全局变量是在函数外部声明的变量，可以在程序的任何地方被访问。在微信小程序中，`...
微信小程序问题汇总
qq_43687594的博客
08-23 987
原因// 错误演示currentIndex = e.detail.current 这里是： 而非 = currentIndex : e . detail . current }) }“pages/cate/cate”里自定义事件，我设置了变量重新赋值为事件本身获取的current的值，结果报错解决方案报错原因是我自己马虎，在事件中重新修改data里的值，需要用setdata，格式为json，赋值使用的应该为 冒号：，而非 =
uniapp项目开发中存在外部浏览器访问页面存在跨域问题！（谷歌浏览器预览，目前小程序和App调试不存在跨域问题！）
ANotes的博客
11-07 2663
uniapp项目开发中存在外部浏览器访问页面存在跨域问题！（谷歌浏览器预览，目前小程序和App调试不存在跨域问题！） 跨域：简单说：就是浏览器访问A域名下面的js，js请求非访问域名(A)的B域名拿取接口数据。（前提服务器不予许跨域；目前开发自启服务基本不能跨域） 如下图所示，访问本地服务页面，该页面js逻辑发起网络请求拿取数据； 存在接口访问域名拿取不到接口数据，并提示使用插件“Allow...
小程序js中data获取服务器数据,微信小程序 获取javascript 里的数据
weixin_33635110的博客
08-10 1396
微信小程序 获取javascript 里的数据wxml如何获取js里的数据例：wxml里：{{txt}}通过上面的{{txt}}可以对应获取js里data下定义的txt的值js里：data: {txt:{}}首先在data里定义一个“容器”txt：{}，{}内为空代表是从别的地方传值进去，当然{}里也可以直接写数据，如txt：{‘123'}，上面的wxml获取了就相当于 123；通过其他方法传值到...
微信小程序WXML页面组件的data-xx 的使用
billykan的博客
09-21 3212
data-xx 的作用是在事件中可以获取WXML页面组件的自定义的节点数据，用于事件的逻辑处理，也可以用来区别组件 比如 写一个list列表 想知道点击的list列表的哪一个item ,比如获取点击的图片,等等 使用data-xx 需要注意的 xx 是自己取的名字 一个demo 写一个这样的布局 wxml <view wx:for="{{wlist}}" wx:key="index"> <view class="" bindtap="showCardView" da
【微信小程序】data="{{...item}}"中...的作用
wy233333的博客
03-19 3264
//js代码 <!-- item: { index: 0, msg: 'this is a template', time: '2016-06-18' } --> //wxml代码 <template name="msgItem"> <view> <text> {{index}}: {{msg}} </text&gt...
微信小程序 数据类型转换(js)
shanshan_1117的博客
04-18 2万+
微信小程序数据转换就是JS方法转换: 1.字符串转float int parseFloat("字符串内容"); //将字符串值转成浮点数 parseInt("字符串内容"); //将字符串值转成整数 此外parseFloat() (1) 如果字符串0位置的值不是数字 ,会返回 NAN (2)如果有两个小数点,则返回第二个小数点前的数字 (3) 如果字符串中有不是数字的值,会返回...
微信小程序Page中data数据操作和函数调用
山水子农
12-14 10万+
Page() 函数用来注册一个页面。接受一个 object 参数，其指定页面的初始数据、生命周期函数、事件处理函数等。 //index.js Page({ data: { text: "This is page data.", sliderOffset: 0,   sliderLeft: 0,   state:{         genre:[],         ge
微信小程序开发之数据请求加载
这是我的博客
06-15 1万+
开发中不可避免会与后台进行多条、多次的数据传递，那我们该如何来将这部分的数据加载进行公共方法进行调用呢，下面就直接上代码啦~ loadList: function (event) { if (hadLastPage != false) { wx.showToast({ title: '到底啦', }); return; } ...
微信小程序开发中的事件捕获和冒泡
09-06
在微信小程序开发中，事件捕获和冒泡是指事件在不同元素之间传递的过程。事件捕获是从外层容器向目标元素触发的过程，而事件冒泡则是从目标元素向外层容器传递的过程。 具体来说，事件捕获是指事件从最外层容器开始逐层向内层元素传递，直到达到目标元素。这意味着事件在触发时会先经过最外层容器，然后逐级传递到目标元素。在微信小程序中，可以通过在捕获阶段监听事件来实现。 而事件冒泡则是指事件从目标元素开始向外层容器传递的过程。在事件冒泡阶段，事件会从目标元素开始向上冒泡，逐级传递到最外层容器。 在微信小程序开发中，我们可以通过在事件处理函数中阻止事件冒泡，即使用`event.stopPropagation()`方法，来阻止事件继续向上冒泡传递。这样可以实现事件只在目标元素上触发，不再向外层传递。 总结起来，事件捕获和冒泡是微信小程序中事件传递的两种方式。事件捕获是从外层向内层传递，而事件冒泡则是从内层向外层传递。在事件处理中，我们可以根据需求选择使用事件捕获或事件冒泡来处理事件。<span class="em">1</span><span class="em">2</span><span class="em">3</span> #### 引用[.reference_title] - *1* [微信小程序开发中的事件捕获和冒泡](https://blog.csdn.net/zebghfv/article/details/118546240)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_2"}}] [.reference_item style="max-width: 33.333333333333336%"] - *2* [微信小程序事件流原理解析](https://download.csdn.net/download/weixin_38655284/14014768)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_2"}}] [.reference_item style="max-width: 33.333333333333336%"] - *3* [微信小程序的事件冒泡和捕获](https://blog.csdn.net/severestcritic/article/details/120938992)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_2"}}] [.reference_item style="max-width: 33.333333333333336%"] [ .reference_list ]
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值