- 发布：2023-07-11 15:54
- 更新：2023-07-11 16:04
- 阅读：243
产品分类： uniapp/App
PC开发环境操作系统： Windows
PC开发环境操作系统版本号： 10
HBuilderX类型： 正式
HBuilderX版本号： 3.8.7
手机系统： 全部
页面类型： vue
vue版本： vue2
打包方式： 云端
项目创建方式： HBuilderX
测试过的手机：
示例代码：
<template>
<view class="content">
<test v-if="form.a" label="a" title="a">{{form.a}}</test>
<test label="b" title="b">{{form.b}}</test>
<test v-if="form.c" label="c">{{form.c}}</test>
<test label="d">{{form.d}}</test>
</view>
</template>
<script>
import test from '../../components/test.vue'
export default {
components: { test },
data() {
return {
form: {
}
}
},
onLoad() {
this.setForm()
},
methods: {
setForm() {
setTimeout(_ => {
this.form = {
a: 1,
b: 2,
c: 3,
d: 4
}
}, 2000)
}
}
}
</script>
<style>
.content {
display: flex;
flex-direction: column;
justify-content: center;
font-size: 32px;
}
</style>
<template>
<view class="test">
<view>
{{label}}
</view>
<view>
{{title}}
</view>
<view>
<slot></slot>
</view>
</view>
</template>
<script>
export default {
name: "test",
props: {
label: String,
title: String
}
}
</script>
<style>
.test {
display: flex;
gap: 10px;
}
</style>
<template>
<view class="content">
<test v-if="form.a" label="a" title="a">{{form.a}}</test>
<test label="b" title="b">{{form.b}}</test>
<test v-if="form.c" label="c">{{form.c}}</test>
<test label="d">{{form.d}}</test>
</view>
</template>
<script>
import test from '../../components/test.vue'
export default {
components: { test },
data() {
return {
form: {
}
}
},
onLoad() {
this.setForm()
},
methods: {
setForm() {
setTimeout(_ => {
this.form = {
a: 1,
b: 2,
c: 3,
d: 4
}
}, 2000)
}
}
}
</script>
<style>
.content {
display: flex;
flex-direction: column;
justify-content: center;
font-size: 32px;
}
</style><template>
<view class="test">
<view>
{{label}}
</view>
<view>
{{title}}
</view>
<view>
<slot></slot>
</view>
</view>
</template>
<script>
export default {
name: "test",
props: {
label: String,
title: String
}
}
</script>
<style>
.test {
display: flex;
gap: 10px;
}
</style>操作步骤：
app真机运行出来的结果和h5是两种结果
app真机运行出来的结果和h5是两种结果
预期结果：
a
b
c
d
a
b
c
d
实际结果：
b
b
c
d
b
b
c
d
bug描述：
app端v-if导致组件属性错乱
Diligent_UI - 【插件开发】【专治疑难杂症】【多款插件已上架：https://ext.dcloud.net.cn/publisher?id=193663(微信搜索飘逸科技UI小程序直接体验)】【骗子请绕道】问题咨询请加QQ群：120594820，代表作灵感实用工具小程序
只看见代码没有看到效果图
BeShine (作者)
一个是app的运行结果，一个是h5的运行结果
-
-
-
回复 8***@qq.com:
这样也可以 我也没发现时什么影响的
<test v-if="form.c" label="c">{{form.c}}</test>
<test v-if="form.a" label="a" title="a">{{form.a}}</test>
<test label="b" title="b">{{form.b}}</test>
<test label="d">{{form.d}}</test>2023-07-11 16:58
-
-
-
-
-
-
BeShine (作者)
效果图就是下面的实际结果
2023-07-11 16:01