1、仅支持flex布局
仅支持flex布局。而且默认的是 flex-direction: column;
2、字体样式
字体的样式,必须要写在 text
标签内,才能生效
错误示例:
<!-- 错误示例 -->
<div class="test">这是一段文字</div>
<style>
.test{
color: red;
}
</style>
正确示例:
<!-- 正确示例 -->
<div>
<text class="test">这是一段文字</text>
</div>
<style>
.test{
color: red;
}
</style>
3、高度问题
nvue文件中,不支持100%,vh,vm
等
例如,在uniapp中
错误写法:
<!-- 错误写法 -->
<div class="container"></div>
<style>
.container{
height: 100vh
}
</style>
正确写法:
<!-- 正确写法 -->
<div class="container" :style="containerStyle"></div>
<script>
export default {
data(){
return {
containerStyle:{
height: '0px'
}
}
},
onLoad(){
this.getScreenHeight()
},
methods:{
// 获取屏幕高度
getScreenHeight() {
uni.getSystemInfo().then(info => {
this.containerStyle.height = info[1].safeArea.height + 'px'
})
},
}
}
</script>