uniapp nvue页面注意事项

写uniapp第一次使用nvue写页面,简单记录几个踩坑点。
首先,因为产品包含app,且有个必要的插件在app时必须是在nvue页面中才能使用,因此才尝试使用nvue编写。

1.默认布局都是flex布局;
2.不支持百分比的写法, 以往习惯写widht:100% 是无效的
3.写css时,只支持class选择器
4.不支持在css写背景图, 可以用image标签写图片,然后进行定位(写定位时,z-index是无效的,标签越靠前,层级越低)
5.不支持.less scss等预编译
6.如果要修改文本样式,文字必须写在text标签中;如果需要实现超出省略号,则必须给text标签写宽度

	.css{
    
    
		lines: 1; /* 超出固定行数显示省略号 */
		width: 626rpx;
		text-overflow: ellipsis; /* 超出部分省略号 */
	}

7.超出1屏无法滚动时,记得外层嵌套scroll-view
8.另外避免在nvue页面this指向错误,所以在app.vue中新增一个指向全局的this, getApp().globalData.self = this; 在这里插入图片描述
在这里插入图片描述

猜你喜欢

转载自blog.csdn.net/oldolder/article/details/132500607