uni-app之vuex(一)
如何获取到vuex中data的值
uni-app中内置了 vuex
所以可以直接去使用哈。
在项目的跟目录下 创建文件夹store
在store目录下创建index.js
index.js目录如下
import Vue from 'vue'
import Vuex from "vuex"
Vue.use(Vuex)
export default new Vuex.Store({
state:{
testArr:[
{id:1,name:"纪念日"}
],
city:"四川省"
},
// 同步更改值
mutations:{
},
//异步
actions:{
getCity(){
console.log()
}
}
})
在main.js中引入vuex,并且挂载到原型上
import Vue from 'vue'
import App from './App'
// 引入store
import store from "./store"
Vue.config.productionTip = false
//将state挂载到原型上
Vue.prototype.$store=store;
App.mpType = 'app'
const app = new Vue({
...App
})
app.$mount()
在index.vue这个页面中去获取vuex中state中的值
onLoad(){
console.log("12", this.$store.state)
}
当我在使用vuex的使用,遇见的一些小问题。
比如说。
在将vuex引入进来的时候,
我想获取它里面的值,始终打印不出来。
因为我的页面写错了。
我写console.log()一个固定的值,都没有打印出来。
这个时候,我才发现,页面写错了。
这个跟vue是一样的哈
uni-app之vuex(一)的更多相关文章
- uni app中使用自定义图标库
项目中难免会用到自定义图标,那在uni app中应该怎么使用呢? 首先, 将图标目录放在static资源目录下: 在main.js中引入就可以全局使用了 import '@/static/icon-o ...
- uni app 零基础小白到项目实战-1
uni-app是一个使用vue.js开发跨平台应用的前端框架. 开发者通过编写vue.js代码,uni-app将其编译到Ios,android,微信小程序等多个平台,保证其正确并达到优秀体验. Uni ...
- uni app以及小程序 --环境搭建以及编辑器
https://developers.weixin.qq.com/miniprogram/dev/devtools/download.html 根据以上网页下载自己电脑相应的版本的微信开发者工具(目录 ...
- uni app canvas 不生效
canvas 创建canvas绘图上下文. <canvas style="width: 300px; height: 200px;" canvas-id="firs ...
- uni app 零基础小白到项目实战2
<template> <scroll-view v-for="(card, index) in list" :key="index"> ...
- uni app 零基础小白到项目实战
$emit 子组件传给父组件 $ref 父组件操作子组件 公用模板 uni-app全局变量的几种实现方法 const websiteUrl = 'http' const now = Date.now ...
- uni app中关于图片的分包加载
因为在项目中使用了大量的静态资源图片,使得主包体积过大, 而把这些图片全部放到服务器又有点麻烦,就想能不能把图片也分包,但是直接放在分包下的话导致图片资源找不到了, 在社区中看到大佬分享的十分有用,特 ...
- uni-app聊天室|vue+uniapp仿微信聊天实例|uniapp仿微信App界面
一.介绍 运用UniApp+Vue+Vuex+swiper+uniPop等技术开发的仿微信原生App聊天室|仿微信聊天界面实例项目uniapp-chatroom,实现了发送图文消息.表情(gif图), ...
- uni-app 保持登录状态 (Vuex)
在小程序中,保持登录状态是很常见的需求,今天就把写一写使用uni-app框架的保持登录状态功能是怎样实现的. 一.场景需求 1.场景:初始打开---登陆---关闭,再次打开---(已登录)上次关闭前的 ...
- Vue爬坑之vuex初识
在 Vue.js 的项目中,如果项目结构简单, 父子组件之间的数据传递可以使用 props 或者 $emit 等方式 http://www.cnblogs.com/wisewrong/p/62660 ...
随机推荐
- CF2023C C+K+S 题解
题面 给您两个强联通的 \(^{\dagger}\) 有向图,每个图都有精确的 \(n\) 个顶点,但可能有不同数量的边.仔细观察后,您发现了一个重要特征--这些图中任何一个环的长度都能被 \(k\) ...
- 1、oracle实例、软件、库简单讲解
oracle的基本结构 oracle软件(RDBMS) oracle软件:关系型数据库管理系统 在linux系统上,oracle软件安装在:/u01/app/oracle这个目录下 oracle数据库 ...
- 《花100块做个摸鱼小网站! 》第十篇—响应式布局适配PC端和移动端
️基础链接导航️ 服务器 → ️ 阿里云活动地址 看样例 → 摸鱼小网站地址 学代码 → 源码库地址 一.前言 大家好呀,我是summo,小网站一直有个问题,就是PC端的样式和移动端的样式是两套,并且 ...
- JDK中的动态代理
江苏 无锡 缪小东 写到代理模式这章,不得不提到JDK中的动态代理,它是java语言自身对动态代理的支持,类似于JDK中在java.util包中提供Observable类和Observer接口提供对观 ...
- 数据库管理软件之DataGrip
DataGrip 是由JetBrains公司推出的数据库管理软件,DataGrip支持几乎所有主流的关系数据库产品,如DB2.Derby.H2.MySQL.Oracle.PostgreSQL.SQL ...
- 2023-05 多校联合训练 ZJNU站 热身赛
猫猫接币币 给定两个容量分别为a和b的盒子,已知第i秒天上会掉下i个金币,你会从第1秒开始接金币,每秒钟你可以选择任意一个盒子接金币,但是不能不选,你必须使得两个盒子刚好装满,请问是否存在某个时刻,使 ...
- 1分钟学会如何提升PCIe通信速率,基于RK3568J + FPGA国产平台!
测试数据汇总 表 1 PCIe总线介绍 PCIe,即PCI-Express(peripheral component interconnect express)是一种高速串行计算机扩展总线标准.主要用 ...
- 十亿手机号去重-BitSet
思路:使用Java自带BitSet函数,将手机号分为两段(15555555555 -> 155+55555555) public class demo { public static void ...
- 强网杯2023 谍影重重3.0 wp
参考文章:[使用主动探测方法识别 U2hhZG93c29ja3M=(base64) 服务 - Phuker's Blog]:https://phuker.github.io/posts/U2hhZG9 ...
- jumpserver 工单系统 二次开发工单管理并开源代码
介绍 JumpServer 是广受欢迎的开源堡垒机,是符合 4A 规范的专业运维安全审计系统.JumpServer 帮助企业以更安全的方式管控和登录所有类型的资产,实现事前授权.事中监察.事后审计,满 ...