fix(nvue): v-model with input,textarea (question/143547)

packages/uni-app-vite/__tests__/nvue/__snapshots__/compiler.spec.ts.snap

@@ -8,8 +8,8 @@ const _hoisted_1 = [\\"modelValue\\"]
 export function render(_ctx, _cache) {
   return (_openBlock(), _createElementBlock(\\"u-input\\", {
     modelValue: _ctx.text,
-    \\"onUpdate:modelValue\\": _cache[0] || (_cache[0] = $event => ((_ctx.text) = $event))
-  }, null, 8 /* PROPS */, _hoisted_1))
+    onInput: _cache[0] || (_cache[0] = $event => ((_ctx.text) = $event.detail.value))
+  }, null, 40 /* PROPS, HYDRATE_EVENTS */, _hoisted_1))
 }"
 `;
 
@@ -45,8 +45,8 @@ const _hoisted_1 = [\\"modelValue\\"]
 export function render(_ctx, _cache) {
   return (_openBlock(), _createElementBlock(\\"u-textarea\\", {
     modelValue: _ctx.text,
-    \\"onUpdate:modelValue\\": _cache[0] || (_cache[0] = $event => ((_ctx.text) = $event))
-  }, null, 8 /* PROPS */, _hoisted_1))
+    onInput: _cache[0] || (_cache[0] = $event => ((_ctx.text) = $event.detail.value))
+  }, null, 40 /* PROPS, HYDRATE_EVENTS */, _hoisted_1))
 }"
 `;
 

packages/uni-app-vite/src/nvue/plugin/transforms/vModel.ts

 import {
   transformModel as baseTransform,
   DirectiveTransform,
+  isStaticExp,
+  NodeTypes,
 } from '@vue/compiler-core'
-// 所有的 v-model 均走自定义组件的实现逻辑，包括 input,textarea
+const tags = ['u-input', 'u-textarea']
 export const transformModel: DirectiveTransform = (dir, node, context) => {
-  return baseTransform(dir, node, context)
+  const result = baseTransform(dir, node, context)
+  // 将 u-input,u-textarea 的 onUpdate:modelValue 事件转换为 onInput
+  if (tags.includes(node.tag) && result.props.length >= 2) {
+    const key = result.props[1].key
+    let value = result.props[1].value
+    if (value.type === NodeTypes.JS_CACHE_EXPRESSION) {
+      value = value.value
+    }
+    if (
+      isStaticExp(key) &&
+      key.content === 'onUpdate:modelValue' &&
+      value.type === NodeTypes.COMPOUND_EXPRESSION
+    ) {
+      key.content = 'onInput'
+      // 替换 $event 为 $event.detail.value
+      value.children = value.children.map((child) => {
+        if (typeof child === 'string') {
+          return child.replace(/=\s\$event/g, `= $event.detail.value`)
+        }
+        return child
+      })
+    }
+  }
+  return result
 }