發表文章
目前顯示的是有「Vue」標籤的文章
Laravel + Vue3 + Pinia 筆記
- 取得連結
- X
- 以電子郵件傳送
- 其他應用程式
npm install 以下套件 "pinia": "^2.0.36", "vue": "^3.3.2", "vue-loader": "^16.8.3", "vue-template-compiler": "^2.7.14" resources/js/counterStore.js 範例 import { defineStore } from 'pinia'; export const useCounterStore = defineStore('counter', { state: () => ({ count: 0 }), getters: { double: (state) => state.count * 2, }, actions: { increment() { this.count++ } } }); 在 resources/js/app.js 加上 import { createApp } from 'vue'; import { createPinia } from 'pinia'; import { mapStores } from 'pinia'; import { useCounterStore } from './counterStore.js'; const pinia = createPinia(); window.app = createApp({ computed: { ...mapStores(useCounterStore), } }) .use(pinia) .mount('#app'); 執行 npm run prod
Laravel + Vue3 + Vuex 筆記
- 取得連結
- X
- 以電子郵件傳送
- 其他應用程式
npm install 以下套件 "vue": "^3.2.37", "vue-loader": "^16.8.3", "vue-template-compiler": "^2.7.10", "vuex": "^4.0.2" resources/js/exampleStore.js 範例 export default { state () { return { count: 0 } }, mutations: { increment (state) { state.count++ } } }; 在 resources/js/app.js 加上 import { createApp } from 'vue'; import { createStore } from 'vuex'; import exampleStore from './exampleStore.js'; window.store = createStore({ modules: { example: exampleStore } }); window.app = createApp({ // }) .use(store) .mount('#app'); 執行 npm run prod