uniapp 遇到的問題


uniapp開發遇到的問題記錄

1.uniapp不能使用瀏覽器對象

在uniapp開發中 使用window、document等瀏覽器對象不會生效,存在這些的話uniapp將無法打包成功,最好使用 uniapp官方的api

2.網絡請求最好使用uni.request()

小編在項目中使用axios,打包后axios失效 無法發送請求,查資料未果;
果斷選擇了 uview ui框架的http
寫uniapp是 uview這個框架也是不錯的選擇

3.頁面字體適配

在uniapp中 不推薦使用rem,官方有自己的rpx單位也相對實用,
如果你就想使用rem來寫uniapp的話,下面就是眾多實現方法中的一種適配方案

1.在mian.js 掛載$fontSize變量
import Vue from 'vue'
//import uView from "uview-ui";
uni.getSystemInfo({
	success:(res)=>{
		// console.log(res)
		// console.log(res.screenWidth)
		// console.log(res.screenWidth/750*75)
		// console.log(app,'999')
		getApp().globalData.fontSize = res.screenWidth/750*75
	}
})
Vue.prototype.$fontSize = getApp().globalData.fontSize
//主要通過uni.getSystemInfo 來獲取當前使用設備的各項參數,
//要調整屏幕的適配 首先要知道當前設備的型號 及屏幕大小
2.通過 page-meta 標簽來實現 樣式的賦值 page-meta 資料
//在相應的頁面上添加

<page-meta :root-font-size="fontSize + 'px'"></page-meta>

// uniapp 只有app.vue為入口文件  沒有結構代碼 只能在各個頁面上添加  
//如果你寫的是H5的話 可以再index.html中添加設置rem的根頁面Font-size大小

在使用page-meta要注意 這個是新加的 有版本要求的

4. 關於頁面后退 並刷新頁面

uni.navigateBack({
	success: function() {
		console.log('已回退', getCurrentPages())
		const pages = getCurrentPages()
		let page = pages[Math.max(pages.length - 1 - 1, 0)]
		// page.onLoad(page.options)
		page.lianxiren()
		// console.log(page,'66')
	}
})

也可以

//app端 小程序端 getCurrentPages獲取的參數有些不同
var pages = getCurrentPages();
var currPage = pages[pages.length - 1];   //當前頁面
var prevPage = pages[pages.length - 2];  //上一個頁面
//console.log(prevPage ); //按照打印結構這樣賦值雖然成功但頁面數據不會修改
// prevPage.data.$root[0].title = 'Hello World'
prevPage.setData({
	title: 'Hello World'
})
uni.navigateBack()

4. 事件監聽的觸發時機

//uni.$emit()傳值和uni.$on()接收
//A頁面, onShow中添加監聽一個handleFun的事件
onShow(){
    uni.$on("handleFun", res => {
        this.title = res.title;
        // 清除監聽
        uni.$off('handleFun');
    })
},

//B頁面, 返回A頁面觸發一個事件,使用uni.$emit("handleFun",{})
getAddress(){
    uni.$emit("handleFun",{title: 'Hello World'});
    uni.navigateBack()
}


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM