//app
<template>
<div id="app">
<div id="nav">
<router-link to="/">О нас</router-link> |
<router-link to="/about" @update-cart="updateCart">Завтраки</router-link> |
<router-link :to="{ name: 'Cart', params: { id: [{'sd':1},{'sd':2},{'sd':3}] } }">Мой заказ</router-link>
</div>
<router-view/>
</div>
</template>
<script>
export default {
data(){
return {
order:[
{ message: 'Foo' },
{ message: 'Bar' }
],
}
},
methods: {
updateCart(e) {
this.order.push(e);
},
},
}
</script>
<style lang="scss">
#app {
font-family: Avenir, Helvetica, Arial, sans-serif;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
text-align: center;
color: #2c3e50;
}
#nav {
padding: 30px;
a {
font-weight: bold;
color: #2c3e50;
&.router-link-exact-active {
color: #42b983;
}
}
}
</style>
//about
<template>
<div class="container">
<div class="row">
<div class="col-sm-6">
<div class="card">
<div class="card-body">
<h5 class="card-title">Омлет</h5>
<p class="card-text">With supporting text below as a natural lead-in to additional content.</p>
<a href="#" class="btn btn-danger">-</a>
<a href="#" class="btn btn-primary" @click="addToCart">+</a>
</div>
</div>
</div>
<div class="col-sm-6">
<div class="card">
<div class="card-body">
<h5 class="card-title">рубыа</h5>
<p class="card-text">With supporting text below as a natural lead-in to additional content.</p>
<a href="#" class="btn btn-danger">-</a>
<a href="#" class="btn btn-primary">+</a>
</div>
</div>
</div>
</div>
</div>
</template>
<script>
export default {
props: ['message'],
data(){
return {
}
},
methods:{
addToCart() {
this.$emit('update-cart', {message:'dauren'})
}
}
}
</script>
пытаюсь из about передать данные в app, чтобы затем весь массив передавать в cart.vue
Не получается из about принять в app.vue.