uniapp學(xué)習(xí)-新建項(xiàng)目

1、下載全uniapp hubilderX;

2、文件-新建-項(xiàng)目-uniapp-取個(gè)名字如demo-新建

3、目錄結(jié)構(gòu)

pages 放頁面目錄

static 放靜態(tài)文件資源

app.vue 放公共css等應(yīng)用入口文件

main.js 應(yīng)用入口文件 注冊vue等

manifest.json 項(xiàng)目配置

pages.json 頁面配置

如果新建目錄, common存放公用的文件;components 存放自定義組件,store 是vuex目錄.

unpackage 編譯后的文件存放目錄

4、模板語法

模板塊:<template> <!-- v-bind 可以簡寫成 : , 組件屬性要使用data中定義的數(shù)據(jù)變量,或者組件屬性要使用表達(dá)式,要使用v-bind指定? v-bind:class="msg" = :class="msg" v-on 可以簡寫成@ , 綁定事件v-on:click="show" = @click --> <view class="content" v-bind:class="msg" v-bind:data="true ? '對的' : '錯(cuò)的'"> hello {{msg}} <button v-on:click="show">點(diǎn)我</button> <input type="text" value="哈哈哈哈過" /> <a href="http://www.itdecent.cn/">http://www.itdecent.cn/</a> <block></block> <uni-tag text="123" type="" type="error" :circle="true"></uni-tag> </view> </template> <script> export default { data() { return { title: 'Hello', msg: 'hellos' } }, onLoad() { }, methods: { // 自定義方法寫到methods里 show() { console.log('點(diǎn)了按鈕'); } } } </script> <style> </style>

5、引入擴(kuò)展組件:如分段器,選擇非uni-modules版本,使用HBUILDERX下載,選擇當(dāng)前項(xiàng)目即可導(dǎo)入。刷新頁面。





學(xué)了一個(gè)中午,發(fā)現(xiàn)只要用 uView就好了。 uView的目標(biāo)是成為uni-app生態(tài)最優(yōu)秀的UI框架, 下載一個(gè)空白包就能快速用。。。


?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時(shí)請結(jié)合常識(shí)與多方信息審慎甄別。
平臺(tái)聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡書系信息發(fā)布平臺(tái),僅提供信息存儲(chǔ)服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

  • uni-app的基本使用 課程介紹: 基礎(chǔ)部分: 環(huán)境搭建 頁面外觀配置 數(shù)據(jù)綁定 uni-app的生命周期 組件...
    __Mr_Xie__閱讀 1,542評論 0 1
  • uni-app的基本使用 課程介紹: 基礎(chǔ)部分: 環(huán)境搭建 頁面外觀配置 數(shù)據(jù)綁定 uni-app的生命周期 組件...
    flyjar閱讀 790評論 0 2
  • # 傳智播客vue 學(xué)習(xí)## 1. 什么是 Vue.js* Vue 開發(fā)手機(jī) APP 需要借助于 Weex* Vu...
    再見天才閱讀 3,788評論 0 6
  • 最近在學(xué)習(xí)Vue,下面是學(xué)習(xí)過程中總結(jié)了一些基本的知識(shí)點(diǎn) Vue 一. 基本知識(shí) 1. 實(shí)例化 2. 過濾器 {{...
    冬天吃橘子_Autumn閱讀 624評論 0 2
  • Vue官方文檔以下內(nèi)容作為本人日常學(xué)習(xí)使用,不作為參考 一、Vue環(huán)境搭建以及vue-cli的使用 Vue多頁面應(yīng)...
    好一只帥鹵蛋閱讀 873評論 0 1

友情鏈接更多精彩內(nèi)容