vue 路由 取数据

  

乱七八槽,反正上课很不认真听,天天打扰其他人 

声明式路由: 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 --save

  2. 在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}}

 

相关文章