《Add.vue》

<template>
??<div>
??????<p>標題</p>
??????<input?type="text"?v-model="title"></input>
??????<p>新聞內容</p>
??????<input?type="text"?v-model="content"></input>
????<p><button?type="buttom"?@click="add()">提交</button></p>
????</div>
????</template>

????<script>
????????import?store?from?"../../../travel/src/store";
????export?default?{
????????name:?"add.vue",
????????store:store,
????????data(){
????????????return{
????????????????title:'',
????????????????content:''
????????????}
????????},
????????methods:{
????????????add(){
????????????????store.commit('addItem',{
????????????????????title:?this.title,
????????????????????content:?this.content
????????????????})
????????????}
????????}
????}
</script>

<style?scoped>

</style>




《store.vue》

import?Vue?from?'vue';
import?Vuex?from?'vuex';

Vue.use(Vuex);

export?default?new?Vuex.Store({
??state:?{
????lists:[]
??},
??mutations:?{
????addItem?(state,?value)?{
????????state.lists.push(value)
????}
??},
??actions:?{

??},
});