建个网站多少钱app,深圳社区网,wordpress在哪里输入统计代码,wordpress如何做淘宝客开始
vue中子组件这一块,有点麻烦。不是说它很难,而是它的传送数据方式,以及和各种前端后端路由混在一起时,如果不清晰很容易就迷茫下面假设:路由配置文件为:router.js父组件为 parent.vue , 路径为 ./parent.vue子组件1为 child1.vue, 路径为 ./child1.vue子组件2为 child2.v…开始
vue中子组件这一块,有点麻烦。不是说它很难,而是它的传送数据方式,以及和各种前端后端路由混在一起时,如果不清晰很容易就迷茫下面假设:路由配置文件为:router.js父组件为 parent.vue , 路径为 ./parent.vue子组件1为 child1.vue, 路径为 ./child1.vue子组件2为 child2.vue, 路径为 ./child2.vue父组件中,使用child1.vue循环生成了一堆卡片,点击每个卡片,跳到对应的卡片详情中去.从这里开始
// parent.vue
template
div classrowdiv classcol v-for(item, index) in whatever :keyindexchild1 :id item.id/child1/div
/div
/templatescript
import child1 from ./child1.vueexport default{data() {whaterver: [....]},components:{child1}
}
/script子组件
// child1
templatediv clickgoTochild2 子组件1 /div
/template
script
export default{props:[id],methods:{goTochild2(){this.$router.push({ name:child2 }, query{ id: this.id })}}
}
/script上面this.$router.push({ name:child2 }) 表示跳转到name为child2的路由查找路由配置文件
// router.js
import Vue from vue
import Router from vue-router
import child2 from ./child2.vueVue.use(Router)export default new Router({routes:[{path:/child2,name:child2,component: child2}]
})有了路由跳转的文件,当点击子组件的时候,根据this.$router.push({ name:‘child2’ }),就会跳转到对应的组件,同时url 也会变为 ip:port ‘/child2’下面是child2获取传递过来的id,然后利用id做事情
templatedivchild2 --- {{ id }}/div
/templatescript
data () {return {id: }
},
created(){this.id this.$route.query.id
}
/script