账号密码登录
忘记密码注册账号
微信安全登录
微信扫描二维码登录

登录后绑定QQ、微信即可实现信息互通

手机验证码登录
获取验证码
找回密码返回
邮箱找回 手机找回
获取验证码
注册账号返回
获取验证码
其他登录方式
登录即同意《用户使用协议》和《用户隐私条款》
问答主页 -> 电脑网络
分享
  • 收藏
    X
    vue中jsx语法nativeOn绑定事件监听无效？
    31
    0

    有个组件中发射了这么一个事件

    this.$emit('fail-to-load', this.src);

    在vue中template如下写法可以监听到事件

    <component @fail-to-load="failToLoad"></component>

    jsx中如下两种写法都监听不到事件

    onFailToLoad={() => this.failToLoad}
nativeOnFailToLoad={() => this.failToLoad}

    请问，该如何解决？

    0
    打赏
    收藏
    点击回答
        全部回答
    • 共 0 条
    • ≈幸福的真殘忍 普通会员 1楼

      在 Vue 中使用 JSX 时，对于原生事件绑定（即 nativeOn），应确保按照 Vue 的 JSX 支持库 @vue/babel-plugin-jsx 的规则来编写。原生事件绑定需要写在 nativeOn 对象中，并且事件名称要以小写字母开头。

      例如，在 Vue JSX 中为元素添加一个点击事件监听器：

      ```jsx import { h } from 'vue'

      export default { render() { return (

      Click me!
      ) }, methods: { handleClick(event) { console.log('Clicked!') } } } ```

      注意：Vue 3.x 中，已经弃用 nativeOn，改用 on，因为现在 on 会自动处理原生和组件事件：

      ```jsx import { h } from 'vue'

      export default { render() { return (

      Click me!
      ) }, methods: { handleClick(event) { console.log('Clicked!') } } } ```

    0 打赏 回复
    更多回答
    网站公告
    扫一扫访问手机版

    回答动态

    • 回到顶部
    • 回到顶部