时间戳

首页 > 解决方案 > 如何通过路由设置和传递 JSON 道具

vue.js - 如何通过路由设置和传递 JSON 道具

问题描述

在 vue.js 中的 route.js

[{path: "/path", name: "acomp_name", component: PathComp, props: { abc: {} }}]

压缩包

<script>
...omitted_for_brevity,
methods: {
  changeRoute(json_sample){
     this.$router.push({name: "acomp_name", params: { abc: json_sample })
  }
}
</script>
  1. 有没有一种方法可以设置作为对象的道具以返回作为另一个对象的 json 样本，这样我可以在推送中设置路由器的道具的值
  2. 如果 vue-router4 确实不支持它。已经使用或正在使用什么方法来做到这一点？

标签： vue.jsrouter

解决方案

感谢全能的上帝帮助我创建了一个直观可靠的答案，N<>B 解决方案适用于 vue3 和 vue-router4x

在模板内某处的 comp.vue 中，我有一个嵌套或子组件，所以

    <template>
      <p>...</p>
    ...omitted_for_brevity
    <router-view :prop_from_router.js="this.state.a_key_I_want_to_use"/>
    </template>

还在comp.vue中

<script>
...omitted_for_brevity
setup(){
  const s = reactive({})
  return {s}
},
methods: {
  changeRoute(t)
  this.state.a_key_i_want_to_use = t
}
}
</script>

推荐阅读