微信小程序全局数据共享
文章目录
- 安装MobX相关的包
- 根目录创建store文件夹,添加store.js文件
- 绑定到页面中
- 绑定到组件
mobx-miniprogram和mobx-miniprogram-bindings实现全局数据共享
mobx-miniprogram用来创建Store实例对象
mobx-miniprogram-bindings用来把Store中的共享数据或方法,绑定到组件或页面中使用
安装MobX相关的包
npm install --save mobx-miniprogram@4.13.2 mobx-miniprogram-bindings@1.2.1
注意:MobX相关的包安装完毕之后,记得删除miniprogram_npm目录后,在选项中重新构建npm。
根目录创建store文件夹,添加store.js文件
store.js
//在这个JS文件中,专门创建Store的实例对象
import {action, observable} from "mobx-miniprogram"export const store = observable({//里面声明共享数据numA:1,numB:2,//读取get sum(){return this.numA+this.numB},//修改updateNum1:action(function(step){this.numA += step}),updateNum2:action(function(step){this.numB += step}),
})
绑定到页面中
//页面的.js文件
import{createStoreBindings } from'mobx-miniprogram-bindings'//绑定方法
import{store}from'../../store/store'//实例对象映射到当前页面Page({onLoad:function(){//生命周期函数--监听页面加载//第一个参数this代表该页面实例,第二个参数「store,fields,actios」分别代表数据源,字段,方法//自定义属性storeBindings为createStoreBindings方法的返回值this.storeBindings = createStoreBindings(this,{store,fields:['numA','numB','sum'],actions:['updateNum1']
})
},
onUnload:function(){//生命周期函数--监听页面卸载//清理绑定的数据和方法this.storeBindings.destroyStoreBindings()
}
绑定到组件
//组件的.js文件
import{storeBindingBehavior} from'mobx-miniprogram-bindings'//绑定方法
import{store}from'../../store/store'//实例对象映射到当前组件Compoent({behaviors:[storeBindingsBehavior],//通过storeBindingsBehavior来实现自动绑定storeBindings:{store,//指定要绑定的Storefields:{//指定要绑定的字段数据numA:()=>store.numA,//绑定字段的第一种方式numB:()=>store.numA,//绑定字段的第二种方式sum:'sum' //绑定字段的第三种方式},actions:{//指定要绑定的方法updateNum2:"updateNum2"}},
})
相关文章:
微信小程序全局数据共享
文章目录 安装MobX相关的包根目录创建store文件夹,添加store.js文件绑定到页面中绑定到组件 mobx-miniprogram和mobx-miniprogram-bindings实现全局数据共享 mobx-miniprogram用来创建Store实例对象 mobx-miniprogram-bindings用来把Store中的共享数据或方法&…...
算法训练营第24天|回溯算法理论基础 LeetCode 77.组合
终于把二叉树做完了!开始新的篇章,回溯! 回溯算法理论基础 回溯算法题目分类: 1.组合 2.分割 3.子集 4.排列 5.棋盘问题 什么是回溯? 回溯叫做回溯搜索法,是一种搜索方式。回溯是递归的副产品&…...
pip永久修改镜像地址
修改命令: pip config set global.index-url https://pypi.tuna.tsinghua.edu.cn/simple/ 效果: 会在C:\Users\PC(用户名)\AppData\Roaming\pip目录下新增或修改文件pip.ini 文件内容: [global] index-url https://pypi.tuna.tsinghua.e…...
RK3588平台开发系列讲解(硬件篇-功能外设2)
USB2.0/USB3.0 电路 RK3588 芯片内置两个USB3.0 OTG控制器(内嵌2个USB2.0 OTG,下图绿色处),1个USB3.0 HOST 控制器,2个USB2.0 HOST控制器。 这些控制器与PHY的内部复用图如下: USB3.0 OTG0 控制器支持SS/H…...
SpringBoot学习记录
SpringBoot是用于加速Spring开发的。 我们先来看看如何使用SpringBoot来创建一个基于Web的程序,可以发现相较于SpringMVC其有巨大改变。 3.开发控制器类 GetMapping("/{id}")public String getById(PathVariable Integer id){System.out.println("…...
财富池指标--通达信顾比均线实战指标免费源码
顾比均线是由两组均线构成,短期组为3、5、8、10、12、15。长期组为:30、35、40、45、50、60。顾比均线由澳大利亚的投资家戴若-顾比先生发明,因此叫顾比线。 顾比均线可以广泛运用于股票、期货和外汇交易中,只要是能运用K线图的投…...
AJAX(一):初识AJAX、http协议、配置环境、发送AJAX请求、请求时的问题
一、什么是AJAX 1.AJAX 就是异步的JS和XML。通过AJAX 可以在浏览器中向服务器发送异步请求,最大的优势:无刷新获取数据。AJAX 不是新的编程语言,而是一种将现有的标准组合在一起使用的新方式。 2.XML 可扩展标记语言。XML被设计用来传输和…...
idea常用的快捷键总结:
idea常用的快捷键总结: Ctrl相关的: Ctrl F 在当前文件进行文本查找 (必备) Ctrl R 在当前文件进行文本替换 (必备) Ctrl Z 撤销 (必备) Ctrl Y 删除光标所在行 或 删除选中的…...
LeetCode 热题 100 题解(一):哈希部分
《LeetCode热题 100》 经过了两个多月,终于刷完了代码随想录的题目,现在准备开始挑战热题一百了,接下来我会将自己的题解以博客的形式同步发到力扣和 c 站,希望在接下来的征程中与大家共勉! 题组一:哈希 题…...
C语言 | qsort()函数使用
目录: 1.qsort介绍 2.使⽤qsort函数 排序 整型数据 3.使⽤qsort函数 排序 结构体数据 4. qsort函数的模拟实现冒泡排序 qsort()函数 是一个 C语言编译器函数库自带的排序函数, 它可以对指定数组(包括字符串,二维数组&#x…...
继承的特点 | java
/*Java中继承的特点:A:Java只支持单继承,不支持多继承。 B:Java支持多层继承(继承体系),间接继承 */class Father(){} class Mother(){}class son extends Father(){} // 正确 class son2 extends Father , Mother {} // 不正确 1. Java只支持单继承…...
6、jenkins项目构建类型-项目类型介绍
文章目录 一、自由风格项目1、拉取代码2、演示改动代码后的持续集成二、Maven项目构建三、Pipeline流水线项目构建(☆☆☆)1、Pipeline简介(1)概念(2)使用Pipeline有以下好处(3)如何创建Jenkins Pipeline呢?2、安装Pipeline插件3、Pipeline语法快速入门(1)Declarati…...
指针函数的应用——找出哪些学生有不及格的科目
下面的代码实现了以下功能: 定义了一个函数 getFailStudent,它接收一个指向整数数组的指针,并遍历该数组,查找是否存在不及格的成绩。如果找到了不及格的成绩,就返回指向不及格学生所在行的指针;否则返回 N…...
【微服务】Gateway
文章目录 1.基本介绍官方文档:https://springdoc.cn/spring-cloud-gateway/#gateway-starter1.引出网关2.使用网关服务架构图3.Gateway网络拓扑图(背下来)4.Gateway特性5.Gateway核心组件1.基本介绍2.断言3.过滤 6.Gateway工作机制 2.搭建Gat…...
王道C语言督学营OJ课后习题(课时14)
#include <stdio.h> #include <stdlib.h>typedef char BiElemType; typedef struct BiTNode{BiElemType c;//c 就是书籍上的 datastruct BiTNode *lchild;struct BiTNode *rchild; }BiTNode,*BiTree;//tag 结构体是辅助队列使用的 typedef struct tag{BiTree p;//树…...
Filter、Listener、AJAX
Filter 概念:Filter 表示过滤器,是JavaWeb三大组件(Servlet、Filter、 Listener)之一。 过滤器可以把对资源的请求拦截下来,从而实现一些特殊的功能。 过滤器一般完成一些通用的操作,比如:权限控制、统一编码处理、敏感…...
FastAPI+React全栈开发04 FastAPI概述
Chapter01 Web Development and the FARM Stack 04 Introducing FastAPI FastAPIReact全栈开发04 FastAPI概述 Now we will look at a brief introducion to the Python REST-API framework of choice - FastAPI. Additionally, we will go over a high-level overview of t…...
基于单片机的二维码LCD显示控制设计
**单片机设计介绍,基于单片机的二维码LCD显示控制设计 文章目录 一 概要二、功能设计设计思路 三、 软件设计原理图 五、 程序六、 文章目录 一 概要 基于单片机的二维码LCD显示控制设计是一个集硬件、软件与通信于一体的综合性项目。此设计的主要目标是实现单片机…...
Ubuntu20.04下PCL安装,查看,卸载等操作
Ubuntu20.04下PCL安装,查看,卸载等操作 项目来源 https://github.com/PointCloudLibrary/pclhttps://pointclouds.org/documentation/modules.htmlhttps://pcl.readthedocs.io/projects/tutorials/en/master/ 点云学习: https://github.c…...
Android TargetSdkVersion 30 安装失败 resources.arsc 需要对齐且不压缩。
公司项目,之前targetSDKVersion一直是29,近期小米平台上架强制要求升到30,但是这个版本在android12上安装失败,我用adb命令安装,报错如下图 adb: failed to install c: Program Files (x86)(0A_knight\MorkSpace \Home…...
c++20中的jthread再谈
一、介绍 在前面的C20新功能中,简单的介绍过相关的std::jthread的应用。当时觉得它虽然比std::thread方便一些,但也没有多大的优势。可在后面的不断的学习中,发现std::jthread的使用上确实有优秀之处,相对于传统的线程编程&#…...
Fastgpt 无法启动或启动后无法正常使用的讨论(启动失败、用户未注册等问题这里)
FastGPT 是一个基于 LLM 大语言模型的知识库问答系统,提供开箱即用的数据处理、模型调用等能力。同时可以通过 Flow 可视化进行工作流编排,从而实现复杂的问答场景! FastGPT是非常实用并且相当厉害的个人知识库AI项目,项目是非常…...
Rust 实战练习 - 7. FFI, 库, ABI, libc
FFI FFI(Foreign Function Interface)是这样一种机制:用一种编程语言写的程序能调用另一种编程语言写的函数(routines)。 调用约定,类型表示和名称修饰这三者的统称,即是众所周知的应用二进制…...
vue实现把Ox格式颜色值转换成rgb渐变颜色值(开箱即用)
图示: 核心代码: //将0x格式的颜色转换为Hex格式,并计算插值返回rgb颜色 Vue.prototype.$convertToHex function (colorCode1, colorCode2, amount) {// 确保输入是字符串,并检查是否以0x开头let newCode1 let newCode2 if (t…...
Unity 窗口化设置
在Unity中要实现窗口化,具体设置如下: 在编辑器中,选择File -> Build Settings。在Player Settings中,找到Resolution and Presentation部分。取消勾选"Fullscreen Mode",并选择"Windowed"。设…...
Android14之深入理解sp模板类(二百零二)
简介: CSDN博客专家,专注Android/Linux系统,分享多mic语音方案、音视频、编解码等技术,与大家一起成长! 优质专栏:Audio工程师进阶系列【原创干货持续更新中……】🚀 优质专栏:多媒…...
.NET core 5.0 及以上的Windows Service开发
首先,一定要和.NET Framework区分开, 详细请看微软的2023年的最新官方文档 Create Windows Service using BackgroundService - .NET | Microsoft Learn Create a Windows Service installer - .NET | Microsoft Learn 同样微软的官方微博给出了开发…...
Nginx配置文件解释
Nginx可以作为静态页面的web服务器,同时还支持CGI协议的动态语言,比如perl、php等。但是不支持java。Java程序只能通过与tomcat配合完成。Nginx专为性能优化而开发,性能是其最重要的考量,实现上非常注重效率 ,能经受高负载的考验,…...
R语言赋值符号<-、=、->、<<-、->>的使用与区别
R语言的赋值符号有<-、、->、<<-、->>六种,它们的使用与区别如下: <-’:最常用的赋值符号。它将右侧表达式的值赋给左侧的变量,像一个向左的箭头。例如,x …...
ffmpeg重点之时间戳,PTS、DTS、time_base
PTS和DTS和时间基time_base 首先我们知道PTS是一帧音频或视频显示的时间,DTS是解码时间戳 既然是时间,PST和DTS的单位是什么呢?秒还是毫秒,抑或是纳秒? 先说结论—都不是 先引入FFmpeg中时间基的概念,也就是time_bas…...
如何做公司的网站建设/全球最牛的搜索引擎
导读你是否想要了解安装包中各个文件在 Linux 系统中安装(位于)的位置?我们将在本文介绍如何列出文件的来源,或存在于某个特定包或者一组软件包中的文件。这篇文章可以帮你轻松地找到重要的软件包文件,如配置文件、帮助文档等。我们来看看找出…...
免费网站建设源码/整站优化工具
5为学校中学生选课管理这个现实问题进行数据库模式设计。根据调查分析,确定它的属性集合为:U{S#,C#,SNAME,CNAME,TEACHER,GRADE,SD}下面给出两种确定的模式设计方案:方案一:只有一个关系模式:R(S#,C#,SNAME,CNAME,TEAC…...
工商网站如何做企业增资/北京网站优化怎么样
一 故障现象:硬盘灯告警二 故障分析:硬盘fault三 处理过程:现场查看发现主机配置两块300GB硬盘,且系统正常运行。判断主机应该做了riad 1(fdisk -l命令显示逻辑盘的大小为300GB)在线更换硬盘more /var/log/…...
wordpress评论表情插件/网站seo技术能不能赚钱
前言:通过使用视图(views)可以获得其他实现了Collection接口和Map接口的对象。映射类的keySet方法就是一个示例。keySet方法返回一个实现Set接口的类对象,这个类的方法对原映射进行操作。这种集合称为视图。 1、轻量级集合包装器…...
网站设计深圳哪家强?/alexa排名查询统计
本文纯为大家好好学习Ajax Controltoolkit而写,有不到之处希望大家提出,以免遗祸 众人 标签零 标签一 标签二 标签三 1 11 111 1111 11111 2 22 222 2222 22222 3 33 333 3333 33333 4 44 444 4444 44444 运行结果: 在这显示结果 容器部分属性方法 标签属性方法 ps:如从官方下…...
wordpress audio player/泉州关键词优化软件
redhat上的ftp配置实例环境:redhat9ftp的工作方式分为两种主动(active):当客户端的连接上server的控制端口(21)后,当需要传输数据时,由server主动开启端口(20)连接client被动(passive):控制端口的连接方式与上面一样,只不过当要传数据时,仍是由client发起连接在redhat上采用的软…...