亚洲乱码中文字幕综合,中国熟女仑乱hd,亚洲精品乱拍国产一区二区三区,一本大道卡一卡二卡三乱码全集资源,又粗又黄又硬又爽的免费视频

vue2.0+vuex+localStorage代辦事項(xiàng)應(yīng)用實(shí)現(xiàn)詳解

 更新時(shí)間：2018年05月31日 08:45:50   作者：justDoin  
本篇文章給大家分享了一個(gè)用vue2.0+vuex+localStorage代辦事項(xiàng)應(yīng)用實(shí)現(xiàn)的代碼過(guò)程，有興趣的朋友跟著參考學(xué)習(xí)下。

vue2.0+vuex+localStorage 待辦事項(xiàng)源碼：https://github.com/Mynameisfwk/vue-Todo-list

參考代碼：https://github.com/Mynameisfwk/vivo-shop

代碼預(yù)覽

vuex官方文檔 https://vuex.vuejs.org/ 我覺(jué)的官方文檔說(shuō)明很詳細(xì)

localStorage 用來(lái)本地儲(chǔ)存數(shù)據(jù)

const state={
 home:localStorage["home"]?JSON.parse(localStorage["home"]): [],
 item:localStorage["item"]?JSON.parse(localStorage["item"]): [],
}

export default state
const mutations={
 
 [types.SET_SHIXIANG](state,data){
  state.home.push(data)
  localStorage.setItem("home",JSON.stringify(state.home));
 },
 
 [types.SET_YES](state,data){
  state.item.push(data)
  localStorage.setItem("item",JSON.stringify(state.item));
 }
}

export default mutations
const actions={
 setOrder ({commit}, data) {
  commit('SET_SHIXIANG', data);
 },
 setYes({commit},data){
  commit('SET_YES',data)
 }
}
export default actions

項(xiàng)目截圖

項(xiàng)目運(yùn)行

# install dependencies
npm install

# serve with hot reload at localhost:8080
npm run dev

# build for production with minification
npm run build

相關(guān)文章

  • 如何在Vue3和Vite項(xiàng)目中用SQLite數(shù)據(jù)庫(kù)進(jìn)行數(shù)據(jù)存儲(chǔ)

    如何在Vue3和Vite項(xiàng)目中用SQLite數(shù)據(jù)庫(kù)進(jìn)行數(shù)據(jù)存儲(chǔ)

    SQLite是一種嵌入式關(guān)系型數(shù)據(jù)庫(kù)管理系統(tǒng),是一個(gè)零配置、無(wú)服務(wù)器的、自給自足的、事務(wù)性的SQL數(shù)據(jù)庫(kù)引擎,這篇文章主要給大家介紹了關(guān)于如何在Vue3和Vite項(xiàng)目中用SQLite數(shù)據(jù)庫(kù)進(jìn)行數(shù)據(jù)存儲(chǔ)的相關(guān)資料,需要的朋友可以參考下
    2024-03-03
  • vue 判斷頁(yè)面是首次進(jìn)入還是再次刷新的實(shí)例

    vue 判斷頁(yè)面是首次進(jìn)入還是再次刷新的實(shí)例

    這篇文章主要介紹了vue 判斷頁(yè)面是首次進(jìn)入還是再次刷新的實(shí)例，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧
    2020-11-11
  • uniapp使用webView工作實(shí)踐記錄

    uniapp使用webView工作實(shí)踐記錄

    uni-app中的web-view是一個(gè)web瀏覽器組件,可以用來(lái)承載網(wǎng)頁(yè)的容器,下面這篇文章主要給大家介紹了關(guān)于uniapp使用webView的相關(guān)資料,文中通過(guò)代碼介紹的非常詳細(xì),需要的朋友可以參考下
    2024-06-06
  • vue實(shí)現(xiàn)列表左右聯(lián)動(dòng)效果

    vue實(shí)現(xiàn)列表左右聯(lián)動(dòng)效果

    這篇文章主要為大家詳細(xì)介紹了vue實(shí)現(xiàn)列表左右聯(lián)動(dòng)效果，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
    2022-04-04
  • Vue動(dòng)態(tài)組件與異步組件實(shí)例詳解

    Vue動(dòng)態(tài)組件與異步組件實(shí)例詳解

    這篇文章主要介紹了Vue動(dòng)態(tài)組件與異步組件,結(jié)合實(shí)例形式分析了動(dòng)態(tài)組件與異步組件相關(guān)概念、功能及使用技巧,需要的朋友可以參考下
    2019-02-02
  • vue 如何將二維數(shù)組轉(zhuǎn)化為一維數(shù)組

    vue 如何將二維數(shù)組轉(zhuǎn)化為一維數(shù)組

    這篇文章主要介紹了vue 如何將二維數(shù)組轉(zhuǎn)化為一維數(shù)組，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教
    2022-04-04
  • 詳解Vue快速零配置的打包工具——parcel

    詳解Vue快速零配置的打包工具——parcel

    本篇文章主要介紹了詳解Vue快速零配置的打包工具——parcel，小編覺(jué)得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧
    2018-01-01
  • vue中給路徑起別名的實(shí)現(xiàn)方法

    vue中給路徑起別名的實(shí)現(xiàn)方法

    本文主要介紹了vue中給路徑起別名的實(shí)現(xiàn)方法，文中通過(guò)示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
    2022-03-03
  • Element-Plus Select組件實(shí)現(xiàn)滾動(dòng)分頁(yè)加載功能

    Element-Plus Select組件實(shí)現(xiàn)滾動(dòng)分頁(yè)加載功能

    Element-Plus的select組件并沒(méi)有自帶滾動(dòng)分頁(yè)加載的功能,其雖然提供了自定義下拉菜單的底部的方式可以自定義上一頁(yè)及下一頁(yè)操作按鈕的方式進(jìn)行分頁(yè)加載切換,這篇文章主要介紹了Element-Plus Select組件實(shí)現(xiàn)滾動(dòng)分頁(yè)加載功能,需要的朋友可以參考下
    2024-03-03
  • Vue filter 過(guò)濾器、以及在table中的使用介紹

    Vue filter 過(guò)濾器、以及在table中的使用介紹

    這篇文章主要介紹了Vue filter 過(guò)濾器、以及在table中的使用介紹，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧
    2020-09-09

最新評(píng)論