v-model在h函数和jsx下应该如何写

template里面的v-model,在h函数和jsx下应该如何写,例如

javascript 复制代码
<template>
  <el-input v-model="input" placeholder="Please input" />
</template>

用h函数

javascript 复制代码
h(ElInput, {
    modelValue: newText.value,
    "onUpdate:modelValue": (val: string) => {
        newText.value = val;
    },
})

用jsx

javascript 复制代码
<ElInput
        modelValue={newText.value}
        onUpdate:modelValue={(val: string) => (newText.value = val)}
      />

ps:v-model可以理解是一种封装或是语法糖,本质还是属性和事件组合,根因在属性在组件内部是只读,需要通过事件通知到父组件修改。

相关推荐
我是日安1 天前
从零到一打造 Vue3 响应式系统 Day 6 - 响应式核心:链表实装应用
前端·vue.js
艾小码1 天前
Vue模板进阶:这些隐藏技巧让你的开发效率翻倍!
前端·javascript·vue.js
艾小码1 天前
还在手动加载全部组件?这招让Vue应用性能飙升200%!
前端·javascript·vue.js
三十_1 天前
【实录】多 SDK 日志乱象的解决方案:统一日志 SDK 设计分享
前端·javascript
Samsong1 天前
JavaScript逆向之对称加密算法
javascript·逆向
一枚前端小能手1 天前
🛡️ Token莫名其妙就泄露了?JWT安全陷阱防不胜防
前端·javascript·安全
薛定谔的算法1 天前
Vue.js 条件渲染与列表渲染详解:原理、用法与最佳实践
前端·vue.js·前端框架
李游Leo1 天前
JavaScript事件机制与性能优化:防抖 / 节流 / 事件委托 / Passive Event Listeners 全解析
开发语言·javascript·性能优化
复苏季风1 天前
Vue3 小白的疑惑:为什么用 const 定义的变量还能改?
前端·javascript·vue.js
扉川川1 天前
File和Blob对象的区别
javascript