久久精品国产亚洲高清|精品日韩中文乱码在线|亚洲va中文字幕无码久|伊人久久综合狼伊人久久|亚洲不卡av不卡一区二区|精品久久久久久久蜜臀AV|国产精品19久久久久久不卡|国产男女猛烈视频在线观看麻豆

千鋒教育-做有情懷、有良心、有品質(zhì)的職業(yè)教育機(jī)構(gòu)

手機(jī)站
千鋒教育

千鋒學(xué)習(xí)站 | 隨時(shí)隨地免費(fèi)學(xué)

千鋒教育

掃一掃進(jìn)入千鋒手機(jī)站

領(lǐng)取全套視頻
千鋒教育

關(guān)注千鋒學(xué)習(xí)站小程序
隨時(shí)隨地免費(fèi)學(xué)習(xí)課程

當(dāng)前位置：首頁(yè)  >  技術(shù)干貨  > Kbone基礎(chǔ) - [03] Vue+Kbone實(shí)現(xiàn)Todos App

Kbone基礎(chǔ) - [03] Vue+Kbone實(shí)現(xiàn)Todos App

來(lái)源：千鋒教育
發(fā)布人：wjy
時(shí)間： 2022-10-11 14:36:28 1665470188

　　Kbone 基礎(chǔ) - [03] Vue + Kbone 實(shí)現(xiàn) Todos App

　　1、搭建Vue開發(fā)環(huán)境

　　在命令行輸入以下命令，創(chuàng)建一個(gè) vue-todos 項(xiàng)目：

Vue+Kbone實(shí)現(xiàn)Todos App1

　　2、編寫Vue todos代碼

　　2.1 改寫main.js

　　將 main.js 引入的 App.vue 組件替換為 Todos.vue 組件：

Vue+Kbone實(shí)現(xiàn)Todos App2

　　2.2 編寫 Todo.vue 組件

　　在項(xiàng)目 src 目錄下，創(chuàng)建 Todos.vue 文件：

Vue+Kbone實(shí)現(xiàn)Todos App3

Vue+Kbone實(shí)現(xiàn)Todos App4

Vue+Kbone實(shí)現(xiàn)Todos App5

Vue+Kbone實(shí)現(xiàn)Todos App6

Vue+Kbone實(shí)現(xiàn)Todos App7

Vue+Kbone實(shí)現(xiàn)Todos App8

Vue+Kbone實(shí)現(xiàn)Todos App9

Vue+Kbone實(shí)現(xiàn)Todos App10-

　　2.3 項(xiàng)目預(yù)覽效果

　　在控制臺(tái)執(zhí)行 npm serve 命令，瀏覽器效果如下：

Vue+Kbone實(shí)現(xiàn)Todos App11

　　3、將vue項(xiàng)目編入Kbone

　　3.1 改寫kbone-vue項(xiàng)目main.js文件

Vue+Kbone實(shí)現(xiàn)Todos App12

　　3.2 拷貝Totos.vue組件

　　拷貝 Todos.vue 到 kbone-vue 項(xiàng)目的 src 根目錄下。

　　3.3 編寫 todos.mp.js

　　在 kbone-vue 項(xiàng)目的 src/mp 根目錄下，創(chuàng)建 todos.mp.js 文件：

Vue+Kbone實(shí)現(xiàn)Todos App13

　　3.4 修改kbone-vue項(xiàng)目的webpack.mp.config.js

Vue+Kbone實(shí)現(xiàn)Todos App14

　　注意：確保 todos 在 entry 里位于第一個(gè)key，這樣 todos 對(duì)應(yīng)的頁(yè)面就是小程序的默認(rèn)打開頁(yè)面。

　　3.5 項(xiàng)目預(yù)覽效果

　　在控制臺(tái)執(zhí)行 npm run mp 或者 npm run build 命令，在小程序開發(fā)工具中導(dǎo)入 kbone-vue/dist/mp, 效果如下：

Vue+Kbone實(shí)現(xiàn)Todos App15

tags:
聲明：本站稿件版權(quán)均屬千鋒教育所有，未經(jīng)許可不得擅自轉(zhuǎn)載。
10年以上業(yè)內(nèi)強(qiáng)師集結(jié)，手把手帶你蛻變精英
請(qǐng)您保持通訊暢通，專屬學(xué)習(xí)老師24小時(shí)內(nèi)將與您1V1溝通
免費(fèi)領(lǐng)取
今日已有369人領(lǐng)取成功
劉同學(xué) 138****2860 剛剛成功領(lǐng)取
王同學(xué) 131****2015 剛剛成功領(lǐng)取
張同學(xué) 133****4652 剛剛成功領(lǐng)取
李同學(xué) 135****8607 剛剛成功領(lǐng)取
楊同學(xué) 132****5667 剛剛成功領(lǐng)取
岳同學(xué) 134****6652 剛剛成功領(lǐng)取
梁同學(xué) 157****2950 剛剛成功領(lǐng)取
劉同學(xué) 189****1015 剛剛成功領(lǐng)取
張同學(xué) 155****4678 剛剛成功領(lǐng)取
鄒同學(xué) 139****2907 剛剛成功領(lǐng)取
董同學(xué) 138****2867 剛剛成功領(lǐng)取
周同學(xué) 136****3602 剛剛成功領(lǐng)取

上一篇

Kbone基礎(chǔ) - [02] 快速開發(fā)

下一篇

使用click創(chuàng)建完美的Python命令行程序
相關(guān)推薦HOT
大數(shù)據(jù)測(cè)試工程師需要具備哪些技能?

一、理解大數(shù)據(jù)概念大數(shù)據(jù)測(cè)試工程師需要理解大數(shù)據(jù)的基本概念和原理，如分布式存儲(chǔ)、MapReduce、實(shí)時(shí)計(jì)算等。他們還需要了解如何處理大規(guī)模的...詳情>>

2023-10-14 23:43:03
為什么SpringBoot的 jar 可以直接運(yùn)行?

一、JAR文件的結(jié)構(gòu)與執(zhí)行方式Spring Boot的JAR包是Java Archive的縮寫，它是一種壓縮文件格式，可以將Java項(xiàng)目的類文件、資源文件以及依賴庫(kù)等...詳情>>

2023-10-14 23:01:49
站群服務(wù)器是什么?

站群服務(wù)器的含義與用途站群服務(wù)器主要用于支持站群，即由一組相互鏈接的網(wǎng)站組成的群體。這些網(wǎng)站通常由同一組織或個(gè)人擁有，并且經(jīng)常會(huì)互相鏈...詳情>>

2023-10-14 22:46:12
自編碼器是什么?

一、自編碼器原理自編碼器的設(shè)計(jì)靈感源于神經(jīng)科學(xué)中關(guān)于感知系統(tǒng)的認(rèn)知原理，它的核心思想是將輸入數(shù)據(jù)經(jīng)過編碼過程，形成一個(gè)隱藏層的特征表示...詳情>>

2023-10-14 22:41:10
什么是云網(wǎng)融合?

一、云網(wǎng)融合的定義云網(wǎng)融合是指將云計(jì)算與網(wǎng)絡(luò)技術(shù)相結(jié)合，實(shí)現(xiàn)資源的共享、業(yè)務(wù)的協(xié)同，將網(wǎng)絡(luò)與云端服務(wù)深度融合，提供更靈活、高效、安全的...詳情>>

2023-10-14 22:31:47