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可以理解是一种封装或是语法糖,本质还是属性和事件组合,根因在属性在组件内部是只读,需要通过事件通知到父组件修改。

相关推荐
m0_748229992 分钟前
Vue3高效学习路线全攻略
前端·javascript·vue.js
木辰風18 分钟前
vue在IE浏览器下父页面向子页面传输对象时数据丢失
前端·javascript·html
麻辣翅尖30 分钟前
【vue】基于 pdf.js 实现 pdf 文件预览
vue.js·pdf.js
@呵呵31 分钟前
上传图片裁剪
开发语言·javascript·vue.js
Dragon Wu1 小时前
Web前端 认证token的安全存储策略
前端·javascript·安全·react.js·前端框架
雨季6661 小时前
构建 OpenHarmony 简易分账计算器:用除法解决日常公平难题
javascript·flutter·ui·自动化·dart
克里斯蒂亚诺更新1 小时前
vue2 单文件组件加入浏览器的title和ico的方法
前端·javascript·html
csdn_aspnet1 小时前
JavaScript常用算法深度解析:从浏览器到Node.js的实战
javascript·node.js
2401_892000522 小时前
Flutter for OpenHarmony 猫咪管家App实战 - 疫苗记录实现
开发语言·javascript·flutter
Xxtaoaooo2 小时前
React Native跨平台鸿蒙开发实战:JS 与 ArkTS Native的通信机制详解
javascript·react native·harmonyos