首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

微信小程序入门教程之三:脚本编程

比如,每次操作后,都显示一个动态提示,告诉用户操作的结果,这种效果叫做 Toast。 打开home.js文件,为this.setData()加上第二个参数。...()方法加入了第二个参数,这是一个函数,它会在页面变更完毕后(即this.setData()执行完)自动调用。...开发者工具导入项目代码,点击按钮后,页面渲染结果如下。 ? 过了700毫秒,提示框就会自动消失。 这个示例的完整代码,可以查看代码仓库。...这个例子中,用户点击"取消"按钮后,对话框会消失,控制台会输出一行提示信息。点击"确定"按钮后,对话框也会消失,并且还会去调用that.setData()那些逻辑。...解决方法就是在buttonHandler()的开头,将this赋值给变量that,然后在success()回调函数里面使用that.setData()去调用。

1.8K10
  • 您找到你想要的搜索结果了吗?
    是的
    没有找到

    WePY 在小程序性能调优上做出的探究

    传统H5中跳转后定时器会自动消失,小程序中跳转后定时器仍然工作。 小程序的这种机制差异正好可以更好的实现预加载。通常情况下,我们习惯将数据拉取写在 onLoad 事件中。...预查询数据 用于避免于 redirecting 延时,在跳转时调用 page2 预查询。 扩展了生命周期,添加了onPrefetch事件,会在 redirect 之时被主动调用。...基于开发者工具的代码,单步调试大致还原出完整的流程,以下是还原后的代码: /* setData 主流程精简还原,并非完整主流程,内有注释 */ function setData (obj) {...实验 为了证实setData的性能问题,可以写简单的测试例子去测试: 动态绑定1000条数据的列表进行性能测试,这里测试了三种情况: 最优绑定: 在内存中添加完毕后最后执行setData操作。...WePY 中的 setData 就好比是一个 setter,在每次调用时都会去渲染视图。因此如果再封装一层 getter、setter 就完全没有意义,没有任何优化可言。

    4.9K20

    小程序组件化框架 WePY 在性能调优上做出的探究

    传统H5中跳转后定时器会自动消失,小程序中跳转后定时器仍然工作。 小程序的这种机制差异正好可以更好的实现预加载。通常情况下,我们习惯将数据拉取写在 onLoad 事件中。...预查询数据 用于避免于 redirecting 延时,在跳转时调用 page2 预查询。 扩展了生命周期,添加了onPrefetch事件,会在 redirect 之时被主动调用。...基于开发者工具的代码,单步调试大致还原出完整的流程,以下是还原后的代码: /* setData 主流程精简还原,并非完整主流程,内有注释 */function setData (obj) { if...实验 为了证实setData的性能问题,可以写简单的测试例子去测试: 动态绑定1000条数据的列表进行性能测试,这里测试了三种情况: 最优绑定:在内存中添加完毕后最后执行setData操作。...WePY 中的 setData 就好比是一个 setter,在每次调用时都会去渲染视图。因此如果再封装一层 getter、setter 就完全没有意义,没有任何优化可言。

    1.3K40

    微信小程序中 setData 详解

    console.log("执行setData引起的界面更新渲染完毕后的回调函数"); }) console.log("name经过setData后的数据", this.data.name...); // 川川 } 上面代码的执行顺序是 itclancoder 川川 执行setData引起的界面更新渲染完毕后的回调函数 此结果说明这个setData方法是异步的,等待主线程任务做完了,然后在去执行第二个参数...24 } }) } }) 在上面的代码中,的确可以更改person对象下的age属性,但是随之带来的问题是,person对象下除了age属性,其他属性都消失了 这非常令人郁闷...这个在以后的开发中,很有用,有时候,在需要更改对象下的某个属性值的时候,就可以使用这种方式 04 setData注意事项 直接修改 this.data,而不调用this.setData是无法改变页面的状态的...页面中需要显示的数据,可以挂载在data下面初始化,虽然这个值不一定要先设置,但是建议先声明然后在使用 避免setData的调用过于频繁(setData接口的调用涉及逻辑层与渲染层间的线程通信,通信过于频繁可能导致处理队列阻塞

    2.4K10

    QCustomPlot开发笔记(一):QCustomPlot简介、下载以及基础绘图

    download/qq21497936/85250427   QQ群:1047134658(点击“文件”搜索“qcustomplot”,群内与博文同步更新) QCustomPlot的部署   直接下载后,...然后为图形指定一些数据点,例如通过customPlot->graph(0)->setData(…),例如,以两个QVector的形式表示x和y(键和值)。...视图定制 图形   图形的外观由许多因素决定,所有这些因素都可以修改。以下是最重要的: 线型:调用graph->setLineStyle(…)。...填充将从图形(此处为图形0)到与键(此处为x)轴平行的零值线。如果我们想在这个图和另一个图之间填充通道,我们会另外调用graph->setChannelFillGraph(otherGraph)。...要删除通道填充,只需像其他图形一样传递0,填充将像以前一样一直到达零值线。要完全删除填充,请调用graph->setBrush(Qt::NoBrush)。

    3.8K20

    学用Hooks写React组件——基础版Select组件

    下拉框选中或者点击屏幕其他地方下拉框自动消失。选中后,显示对应的值。如果Select组件在带有滚动条的容器里,则监听容器的滚动来改变下拉框的位置。...Select组件 defaultValue 默认选中的值 onChange 当值被改变的时候调用的方法 getContainer 获取菜单渲染的父节点,默认render body Select.jsx...// 控制下拉框显示/隐藏 const [visible, setVisible] = useState(false); // 当前选中的值 const [data, setData...= props.children.findIndex(n => n.props.value === defaultValue); if (i > -1) { setData...监听document的click事件,来实现点击空白处下拉框消失。但是因为React的事件自己封装了一层并不是原生事件,这里涉及到了原生事件和合成事件的冒泡和捕获问题。

    3.1K20

    如何优雅的在react-hook中进行网络请求

    运行上述代码后,会发现其中的console会一直循环打印,我们知道useEffect函数会在render更新后也就是原来的(componentDidUpdate)进行调用。...这里我们在函数中调用了setData设置接口返回数据,触发页面的更新机制,就造成了死循环。...这里传入一个空数组[],来让effect hook只在component mount后执行,避免在component update后继续执行。...errrrr.png 报错提示不能直接在useEffect中使用async,切实报错中也给出了解决方式,就是把async放在useEffect里面,修改如下,重新运行这个警告就消失了。...CommonFetchApi 我们将上述代码提取出一个通用的网络请求hook也就是自定义一个hook,包含initialData,error,initialState等;自定义hook也是一个函数,在其内部可以调用其他

    9.3K73

    详解:小程序页面预加载优化,让你的小程序运行如飞

    实现预加载后想删掉预加载?只需在实现的类中删除一个字符串即可。 缺点: 需要你按情况替换setData为$setData 需要开发者非常清楚各情况下的上下文是什么。...这里比上面少了50ms是为了让用户看到点击态消失时页面再跳转,体验要好很多。 这样就实现了延迟加载。...这里就要注意上下文的问题了,$onNavigator中的this是调用者clazz实例(这里的clazz实例是SecondPage),并不是小程序的Page,所以在这里是无法调用setData的,因为setData...所以我在$setData中根据上下文的不同,做了不同的处理。要么是渲染数据,要么是合并数据。所以可以在两个时期,都调用$setData。根据this....(也是要改很多东西的,比如你要把第一个时期调用的所有setData全部改成$setData,这个应该说是没有。) 如果不想用预加载,改动量越少越好。(不想用预加载?

    8.5K11

    React Hook概述

    一般来说,在函数退出后变量就会“消失”,而 state 中的变量会被 React 保留,useState() 方法里面唯一的参数就是初始 state,我们可以使用 number 或 string 对其进行赋值...在第一次渲染之后以及每次更新之后都会执行,只需要知道 effect 发生在渲染之后,而不用再去考虑是挂载还是更新状态,Effect 组件在需要清除的时候,可以通过返回一个函数进行清除,React 将会在执行清除操作时调用它...export default MouseTracker 如果某些特定值在两次重渲染之间没有发生变化,可以传递数组作为 useEffect 的第二个可选参数,就能够通知 React 跳过对 effect 的调用...useEffect } from 'react' import axios from 'axios' const useURLLoader = (url) => { const [data, setData...useState(false) useEffect(() => { setLoading(true) axios.get(url).then(result => { setData

    1K21

    Taro | 高性能小程序的最佳实践

    由于 Taro 使用小程序的 template 进行渲染,这会引发一个问题:所有的 setData 更新都需要由页面对象调用。当页面结构较为复杂时,更新的性能可能会下降。...使用 CustomWrapper 组件 CustomWrapper 组件的作用是创建一个原生自定义组件,用于调用后代节点的 setData 方法,以实现局部更新的效果。...众所周知,对小程序性能的影响较大的主要有两个因素,即 setData 的数据量和单位时间内调用 setData 函数的次数。...-- 模态弹窗 --> {isShowModal && } 当 isShowModal 从 true 变为 false 时,模态弹窗会消失。...然而,频繁地调用该方法可能会导致一些问题。 因此,建议将 Taro.getCurrentInstance() 的结果保存在组件中,并在需要时直接使用,以避免频繁调用该方法。

    57710
    领券