export default { data() { return { showPage: true // 默认显示页面 } }, methods: { togglePage() { this.showPage = !this.showPage; // 切换显示状态 } } } }这行代码vue3.2写法
时间: 2023-12-10 20:37:57 浏览: 99
php_page_class.rar_ShowPage.class.php_page_page.class.php_php p
在 Vue 3.2 中,可以使用 `setup` 函数来编写组件。下面是相应的代码:
```js
import { ref } from 'vue';
export default {
setup() {
const showPage = ref(true);
function togglePage() {
showPage.value = !showPage.value;
}
return {
showPage,
togglePage,
};
},
};
```
在 `setup` 函数中,我们使用 `ref` 函数来创建一个响应式的数据 `showPage`,并将其初始值设置为 `true`。然后定义了一个 `togglePage` 方法,用于切换 `showPage` 的值。最后,将 `showPage` 和 `togglePage` 返回,使它们可以在模板中使用。
阅读全文