<template>
<view class="">
<view class="">
username{{form.username}}
</view>
<view class="">
age{{form.age}}
</view>
<input v-model="form.age">
<uni-forms label-position="top" :model="form" ref="form">
<uni-forms-item required label="账号" name="username">
<input v-model="form.username" />
</uni-forms-item>
</uni-forms>
</view>
</template>
<script setup>
import { reactive,ref} from "vue"
let form = reactive({
username: '张三',
age: 14
})
</script>
- 发布:2022-10-12 17:15
- 更新:2022-10-13 11:16
- 阅读:276
产品分类: uniapp/H5
PC开发环境操作系统: Windows
PC开发环境操作系统版本号: win11
HBuilderX类型: 正式
HBuilderX版本号: 3.6.4
浏览器平台: Chrome
浏览器版本: 105.0.5195.127(正式版本) (64 位)
项目创建方式: HBuilderX
示例代码:
操作步骤:
将这段代码分别运行在微信小程序平台和h5平台
将这段代码分别运行在微信小程序平台和h5平台
预期结果:
h5平台form.username属性应该具有响应式
h5平台form.username属性应该具有响应式
实际结果:
h5平台form.username失去响应式
h5平台form.username失去响应式
bug描述:
input组件嵌套在uni-forms组件中,发现对象属性失去响应式,微信小程序正常,H5失去响应式。
复现步骤:
附件中上传了一个工程的压缩包,将这个压缩包解压后:
npm install
npm run dev:h5
npm run dev:mp-weixin
将项目分别运行在h5端和微信小程序端 ,发现h5端响应式特性失效,如果去除代码中的uni-forms组件,使用普通的input标签代替,则响应式正常。
1***@qq.com (作者)
是uni_modules的安装方式
版本:1.4.22
2022-10-13 15:54
DCloud_UNI_HT
回复 1***@qq.com: 能提供简单 demo 吗?
2022-10-13 16:05
1***@qq.com (作者)
回复 DCloud_UNI_HT: 已经上传了一段简单demo,需要运行在浏览器,你可以试一下把uni-forms组件移除,响应式就会正常。还有这段代码编译在微信小程序响应式也正常
2022-10-14 09:20
DCloud_UNI_HT
回复 1***@qq.com: 需要一个 能运行起来的工程,简单的 demo ,现在无法确定 组件版本,和具体的环境
2022-10-14 11:44
1***@qq.com (作者)
回复 DCloud_UNI_HT: 你好,已经上传了一个简单的工程
2022-10-17 09:51
1***@qq.com (作者)
回复 DCloud_UNI_HT: 你好,请问下问题复现了吗
2022-10-21 09:44
1***@qq.com (作者)
问题沉底了吗
2022-12-05 10:12