如何获取到vuex中data的值

  1. uni-app中内置了 vuex
  2. 所以可以直接去使用哈。
  3. 在项目的跟目录下 创建文件夹store
  4. store目录下创建index.js
  5. index.js目录如下
  6. import Vue from 'vue'
  7. import Vuex from "vuex"
  8. Vue.use(Vuex)
  9. export default new Vuex.Store({
  10. state:{
  11. testArr:[
  12. {id:1,name:"纪念日"}
  13. ],
  14. city:"四川省"
  15. },
  16. // 同步更改值
  17. mutations:{
  18. },
  19. //异步
  20. actions:{
  21. getCity(){
  22. console.log()
  23. }
  24. }
  25. })

在main.js中引入vuex,并且挂载到原型上

  1. import Vue from 'vue'
  2. import App from './App'
  3. // 引入store
  4. import store from "./store"
  5. Vue.config.productionTip = false
  6. //将state挂载到原型上
  7. Vue.prototype.$store=store;
  8. App.mpType = 'app'
  9. const app = new Vue({
  10. ...App
  11. })
  12. app.$mount()

在index.vue这个页面中去获取vuex中state中的值

  1. onLoad(){
  2. console.log("12", this.$store.state)
  3. }

  1. 当我在使用vuex的使用,遇见的一些小问题。
  2. 比如说。
  3. 在将vuex引入进来的时候,
  4. 我想获取它里面的值,始终打印不出来。
  5. 因为我的页面写错了。
  6. 我写console.log()一个固定的值,都没有打印出来。
  7. 这个时候,我才发现,页面写错了。
  8. 这个跟vue是一样的哈

uni-app之vuex(一)的更多相关文章

  1. uni app中使用自定义图标库

    项目中难免会用到自定义图标,那在uni app中应该怎么使用呢? 首先, 将图标目录放在static资源目录下: 在main.js中引入就可以全局使用了 import '@/static/icon-o ...

  2. uni app 零基础小白到项目实战-1

    uni-app是一个使用vue.js开发跨平台应用的前端框架. 开发者通过编写vue.js代码,uni-app将其编译到Ios,android,微信小程序等多个平台,保证其正确并达到优秀体验. Uni ...

  3. uni app以及小程序 --环境搭建以及编辑器

    https://developers.weixin.qq.com/miniprogram/dev/devtools/download.html 根据以上网页下载自己电脑相应的版本的微信开发者工具(目录 ...

  4. uni app canvas 不生效

    canvas 创建canvas绘图上下文. <canvas style="width: 300px; height: 200px;" canvas-id="firs ...

  5. uni app 零基础小白到项目实战2

    <template> <scroll-view v-for="(card, index) in list" :key="index"> ...

  6. uni app 零基础小白到项目实战

    $emit 子组件传给父组件 $ref 父组件操作子组件 公用模板 uni-app全局变量的几种实现方法 const websiteUrl = 'http' const now = Date.now ...

  7. uni app中关于图片的分包加载

    因为在项目中使用了大量的静态资源图片,使得主包体积过大, 而把这些图片全部放到服务器又有点麻烦,就想能不能把图片也分包,但是直接放在分包下的话导致图片资源找不到了, 在社区中看到大佬分享的十分有用,特 ...

  8. uni-app聊天室|vue+uniapp仿微信聊天实例|uniapp仿微信App界面

    一.介绍 运用UniApp+Vue+Vuex+swiper+uniPop等技术开发的仿微信原生App聊天室|仿微信聊天界面实例项目uniapp-chatroom,实现了发送图文消息.表情(gif图), ...

  9. uni-app 保持登录状态 (Vuex)

    在小程序中,保持登录状态是很常见的需求,今天就把写一写使用uni-app框架的保持登录状态功能是怎样实现的. 一.场景需求 1.场景:初始打开---登陆---关闭,再次打开---(已登录)上次关闭前的 ...

  10. Vue爬坑之vuex初识

    在 Vue.js 的项目中,如果项目结构简单, 父子组件之间的数据传递可以使用  props 或者 $emit 等方式 http://www.cnblogs.com/wisewrong/p/62660 ...

随机推荐

  1. CF2023C C+K+S 题解

    题面 给您两个强联通的 \(^{\dagger}\) 有向图,每个图都有精确的 \(n\) 个顶点,但可能有不同数量的边.仔细观察后,您发现了一个重要特征--这些图中任何一个环的长度都能被 \(k\) ...

  2. 1、oracle实例、软件、库简单讲解

    oracle的基本结构 oracle软件(RDBMS) oracle软件:关系型数据库管理系统 在linux系统上,oracle软件安装在:/u01/app/oracle这个目录下 oracle数据库 ...

  3. 《花100块做个摸鱼小网站! 》第十篇—响应式布局适配PC端和移动端

    ️基础链接导航️ 服务器 → ️ 阿里云活动地址 看样例 → 摸鱼小网站地址 学代码 → 源码库地址 一.前言 大家好呀,我是summo,小网站一直有个问题,就是PC端的样式和移动端的样式是两套,并且 ...

  4. JDK中的动态代理

    江苏 无锡 缪小东 写到代理模式这章,不得不提到JDK中的动态代理,它是java语言自身对动态代理的支持,类似于JDK中在java.util包中提供Observable类和Observer接口提供对观 ...

  5. 数据库管理软件之DataGrip

    DataGrip 是由JetBrains公司推出的数据库管理软件,DataGrip支持几乎所有主流的关系数据库产品,如DB2.Derby.H2.MySQL.Oracle.PostgreSQL.SQL ...

  6. 2023-05 多校联合训练 ZJNU站 热身赛

    猫猫接币币 给定两个容量分别为a和b的盒子,已知第i秒天上会掉下i个金币,你会从第1秒开始接金币,每秒钟你可以选择任意一个盒子接金币,但是不能不选,你必须使得两个盒子刚好装满,请问是否存在某个时刻,使 ...

  7. 1分钟学会如何提升PCIe通信速率,基于RK3568J + FPGA国产平台!

    测试数据汇总 表 1 PCIe总线介绍 PCIe,即PCI-Express(peripheral component interconnect express)是一种高速串行计算机扩展总线标准.主要用 ...

  8. 十亿手机号去重-BitSet

    思路:使用Java自带BitSet函数,将手机号分为两段(15555555555 -> 155+55555555) public class demo { public static void ...

  9. 强网杯2023 谍影重重3.0 wp

    参考文章:[使用主动探测方法识别 U2hhZG93c29ja3M=(base64) 服务 - Phuker's Blog]:https://phuker.github.io/posts/U2hhZG9 ...

  10. jumpserver 工单系统 二次开发工单管理并开源代码

    介绍 JumpServer 是广受欢迎的开源堡垒机,是符合 4A 规范的专业运维安全审计系统.JumpServer 帮助企业以更安全的方式管控和登录所有类型的资产,实现事前授权.事中监察.事后审计,满 ...