uni-app 学习总结

1.关于设置背景图问题

   uni-app不支持在css中设置背景图,可以设置图片的base64编码



//其中imageBase64就是64编码

2.uni-app中提示

uni.showToast({
    title: '提示文字',
    duration: 3000,
    icon:'none'
});

3.接口请求

uni.request({
    url:'',
    data:'',
    method:'',
    success:(res)=>{
        console.log(res);
    }
})

4.点击延长跳转

setTimeout(function () {
    uni.navigateTo({
        url:"../index/index"
    })
}, 4000);

5.uni-app中图片轮播


    
        
            
                
            
        
    




//css部分
.uni-margin-wrap {
    height:100%;
    margin:0 0upx;
}
.swiper {
    height: 337upx;
}
.swiper-item {
    display: block;
    line-height: 337upx;
    text-align: center;
}
/*图片宽度设置100% ,高度300upx(设为auto图片无法显示)*/
.swiper-image{  
    width:100%;  
    height:337upx; 
} 

6.密码框右侧眼睛的及密码是否展示


    
        
		密码:
	
	
		
		
	
	
		
		
	


data(){
    return {
		passwordval:'',
		isShowEye:false//是否显示密码
    }
},

passwordClick() {
    this.isShowEye = !this.isShowEye;
},

7.uni-app中本地选择图片转码后,将base64编码发送给后台

//引入插件image-tools    https://ext.dcloud.net.cn/plugin?id=123
import { pathToBase64, base64ToPath } from '@/js_sdk/gsq-image-tools/image-tools/index.js'

uni.chooseImage({
    count: 1,
	success: function (res){
	    let path=res.tempFilePaths[0];
		pathToBase64(path)
			.then(base64 => {
			    uni.request({
					url: url, 
					method:'POST',
					data: {
						picture:base64,
					},
					success: (res) => {
						console.log(res);		
					}
				});
			})
			.catch(error => {
				console.error(error)
			})
		}
});

坑还是比较多的,虽然我做的功能比较简单!!!

你可能感兴趣的:(uni-app)