Vuex demo

<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8">

<title></title>

</head>

<body>

<script src="https://unpkg.com/vue/dist/vue.js"></script>

<script src="https://unpkg.com/vuex@3.0.1/dist/vuex.js"></script>

<div id="app">

  <p>{{count}}

    <button @click="inc">+</button>

    <button @click="dec">-</button>

  </p>

</div>

<script>

const store = new Vuex.Store({

  state: {

    count: 0

  },

  mutations: {

      inc: state => state.count++,

    dec: state => state.count--

  }

})

const app = new Vue({

  el: '#app',

  computed: {

    count () {

        return store.state.count

    }

  },

  methods: {

    inc () {

      store.commit('inc')

    },

    dec () {

        store.commit('dec')

    }

  }

})

</script>

</body>

</html>
巴特西

Vuex demo

最新文章

热门文章
