欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

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

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

vue2.0+vuex+localStorage 待辦事項源碼:https://github.com/Mynameisfwk/vue-Todo-list

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

代碼預(yù)覽

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

localStorage 用來本地儲存數(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

項目截圖

項目運行

# 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項目中用SQLite數(shù)據(jù)庫進行數(shù)據(jù)存儲

    如何在Vue3和Vite項目中用SQLite數(shù)據(jù)庫進行數(shù)據(jù)存儲

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

    vue 判斷頁面是首次進入還是再次刷新的實例

    這篇文章主要介紹了vue 判斷頁面是首次進入還是再次刷新的實例,具有很好的參考價值,希望對大家有所幫助。一起跟隨小編過來看看吧
    2020-11-11
  • uniapp使用webView工作實踐記錄

    uniapp使用webView工作實踐記錄

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

    vue實現(xiàn)列表左右聯(lián)動效果

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

    Vue動態(tài)組件與異步組件實例詳解

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

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

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

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

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

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

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

    Element-Plus Select組件實現(xiàn)滾動分頁加載功能

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

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

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

最新評論