乱七八槽,反正上课很不认真听,天天打扰其他人 声明式路由: router-link编程式路由:this.$router.push({ path: /home }) // 通过拼接路径 // this.$router.push(`/detail/${index}`); // 通过...

乱七八槽,反正上课很不认真听,天天打扰其他人
声明式路由: router-link
编程式路由:this.$router.push({ path: "/home" })
// 通过拼接路径
// this.$router.push(`/detail/${index}`);
// 通过名字由跳转,命名路由 用params传参
// this.$router.push({ name: "detail", params: { id: index } });
//通过页面跳转 直接跳转到跟目录下的home页面
// this.$router.push({ path: "/home" });
<p>我的年龄是{{ $store.state.age }}</p>
methods: {
myClick() {
console.log("我的名字是:" + this.$store.state.name);
},
},
vuex (全局状态管理)
管理的数据是多页面需要共享的数据安装
1. npm install vuex --save2. 在src 下新建store文件夹,然后新建 index.js 文件
3. main.js 引入注册
4.挂载vuex
vue.use(Vuex)5. // 创建vuex对象
const store = new Vuex.Store({
state: {
// 存放的键值对就是管理状态
name: "hello"
}
})6. 取数据
this.$store.state.message
{{$store.state.message}}
本文标题为:vue 路由 取数据


基础教程推荐
- 解决:layUI数据表格+简单查询 2022-12-16
- AJax 把拿到的后台数据在页面中渲染的实例 2023-02-22
- 关于ajax异步访问数据的问题 2023-02-23
- 纯javascript的ajax实现php异步提交表单的简单实例 2022-12-28
- 原生ajax瀑布流demo分享(必看篇) 2023-02-01
- Unicode中的常用字母小结 2022-09-21
- 在IE中为abbr标签加样式 2022-10-16
- ajax实现数据分页查询 2023-01-31
- JavaScript垃圾回收机制(引用计数,标记清除,性能优 2022-08-31
- Ajax提交表单并接收json实例代码 2023-02-13