uni-app 在 vue2 中无法使用 .native 修饰符了

开发环境	版本号	项目创建方式
Mac	osx 12	HBuilderX

示例代码：


```javascript
cpy(event, cls, body){
console.log(event.currentTarget)
},

sinazl 1楼•21 天前

在 uni-app 中，如果你使用的是 Vue 2，确实无法使用 .native 修饰符。这是因为 uni-app 是基于 Vue 的跨平台开发框架，而 .native 修饰符在 Vue 2 中用于监听原生 DOM 事件，但在 uni-app 中，组件的事件机制与原生 DOM 事件不同，因此 .native 修饰符不再适用。

解决方案

使用 v-on 直接监听事件：如果你需要监听组件的事件，直接使用 v-on 或 @ 符号来监听事件，而不需要使用 .native 修饰符。

<template>
  <my-component @click="handleClick"></my-component>
</template>

<script>
export default {
  methods: {
    handleClick() {
      console.log('Component clicked');
    }
  }
}
</script>

使用 $emit 触发自定义事件：如果你在自定义组件中需要触发事件，可以使用 $emit 来触发自定义事件，然后在父组件中监听该事件。

<!-- MyComponent.vue -->
<template>
  <button @click="handleButtonClick">Click Me</button>
</template>

<script>
export default {
  methods: {
    handleButtonClick() {
      this.$emit('custom-click');
    }
  }
}
</script>

<!-- ParentComponent.vue -->
<template>
  <my-component @custom-click="handleCustomClick"></my-component>
</template>

<script>
export default {
  methods: {
    handleCustomClick() {
      console.log('Custom event triggered');
    }
  }
}
</script>

使用 $refs 直接调用子组件方法：如果你需要直接调用子组件的方法，可以使用 $refs 来获取子组件的引用，然后调用其方法。

<!-- ParentComponent.vue -->
<template>
  <my-component ref="myComponent"></my-component>
  <button @click="callChildMethod">Call Child Method</button>
</template>

<script>
export default {
  methods: {
    callChildMethod() {
      this.$refs.myComponent.childMethod();
    }
  }
}
</script>

<!-- MyComponent.vue -->
<template>
  <div>Child Component</div>
</template>

<script>
export default {
  methods: {
    childMethod() {
      console.log('Child method called');
    }
  }
}
</script>