uniapp官網地址:https://uniapp.dcloud.net.cn/
學習源碼:https://gitee.com/qingnian8/uniapp-ling_project.git
顏色網址:https://colordrop.io/
uniapp中如何獲取導航中的路由信息?
onLoad(e){console.log(e)console.log(e.wd)console.log(getCurrentPages())}
uniapp中引入iconfont圖標
https://www.iconfont.cn
下載至本地
解壓文件將.tff文件復制粘貼至uniapp項目中static下的fonts文件夾下
在pages.json配置引入iconfont字體庫并配置字體圖標
"iconfontSrc":"static/fonts/iconfont.ttf", // app tabbar 字體.ttf文件路徑 app 3.4.4+"list": [{"pagePath": "pages/index/index","iconPath": "static/image/icon_component.png","selectedIconPath": "static/image/icon_component_HL.png","text": "組件","iconfont": { // 優先級高于 iconPath,該屬性依賴 tabbar 根節點的 iconfontSrc"text": "\ue102","selectedText": "\ue103","fontSize": "17px","color": "#000000","selectedColor": "#0000ff"}}
api測試網址:https://workspace.apipost.net/2c3f1e8ed464000/apis
https://api.thecatapi.com/v1/images/search?limit=1
http://jsonplaceholder.typicode.com
獲取路由參數
goDetail(id){uni.navigateTo({url:"/pages/detail/detail?id="+id})}
onLoad(e){console.log(e)this.id=e.idthis.getDetail()}
項目地址:gitee.com/qingnian8/uniapp-ling_project
uniapp項目文件打包
1.運行要打包的項目
2.打開manifest.json文件并進行相關的配置
3.發行
注意問題!此應用DCloud appid 為_UNI_DAD3FT8,您不是這個應用的項目成員。1、聯系這個應用的所有者,請求加入項目成員(https://dev.dcloud.net.cn “項目成員管理”-“添加協作者”);2、重新在manifest.json中生成自己的APPID;3、聯系應用所有者將此 DCloud appid 轉讓給當前賬號。
解決方法:重新獲取,替換成當前小程序項目的appid之后,重新獲取
預覽打包好的項目:單擊web文件夾右鍵執行“在外部資源管理器打開”,雙擊index.html文件進行預覽
打包微信小程序
登錄微信公眾平臺:https://mp.weixin.qq.com,打開開發->開發管理,復制粘貼AppID(小程序ID)
點擊發行
小程序中點擊上傳
在微信公眾平臺中找到版本管理,開發版本下即是剛剛上傳好的項目
app打包配置
發行->云打包
scroll-view出現滾動條如何設置消除滾動條?
/deep/ ::-webkit-scrollbar {width:4px !important;height:1px !important;overflow:auto !important;background: transparent !important;-webkit-appearance: auto !important;display:block;}
文字溢出,多行省略顯示
text-overflow: -o-ellipsis-lastline;
overflow: hidden;
text-overflow: ellipsis;
display:-webkit-box;
-webkit-line-clamp:2;
line-clamp: 2;
-webkit-box-orient:vertical;
web端和微信小程序端關于position:fixed;top:0;差異化的解決方法
top:var(–window-top);
left:0;
z-index:1000;
項目(獲取新聞欄目)接口地址:https://ku.qingnian8.com/dataApi/news/navlist.php
https://ku.qingnian8.com/dataApi/news/newslist.php
數據拼接
富文本標簽:rich-text
<rich-text :nodes="detail.content"></rich-text>
使用文本替換對富文本里面的圖片進行修改大小
res.data.content=res.data.content.replace(/<img/gi,'<img style="max-width:100%"')