第34节: Vue3 调用内联处理程序中的方法

在UniApp中使用Vue3框架时，你可以在模板中直接调用组件内联处理程序中的方法。以下是一个示例：

<template>  
  <view>  
    <button @click="handleClick">Click me</button>  
    <p>{{ message }}</p>  
  </view>  
</template>  
  
<script setup>  
import { ref } from 'vue';  
  
const message = ref('Hello, UniApp!');  
const handleClick = () => {  
  message.value = 'Button clicked!';  
  callInlineMethod(); // 调用内联方法  
};  
  
// 定义内联方法  
const callInlineMethod = () => {  
  console.log('Inline method called!');  
};  
</script>

在上面的示例中，我们在handleClick方法中调用了callInlineMethod内联方法。当用户点击按钮时，handleClick方法将被触发，并更新message的值。然后，callInlineMethod方法将在控制台中输出一条消息。通过在模板中直接调用内联方法，你可以方便地在组件内部执行自定义逻辑。

订阅专栏，每日更新

教学视频 Uniapp Vue3 基础到实战

第33节：Vue3 方法与在线检测