跳至主要內容

Hope 主题 demo 中使用 vue

zedo2022年3月15日小于 1 分钟约 110 字

Hope 主题 demo 中使用 vue

Option API

vue3 option api
<template>
    <p>a = {{ a }}</p>
    <button @click="change">点击+1</button>
</template>
<script>
export default {
    data: () => ({ a: 0 }),
    methods: {
        change() {
            this.a += 1;
        },
    },
};
</script>

Composition API

vue3 option api
<template>
    <p>a = {{ a }}</p>
    <button @click="change">点击+1</button>
</template>
<script>
// 注意在demo中需要从 'Vue' 中解构
const { ref } = Vue;
export default {
    setup() {
        const a = ref(0);
        function change() {
            a.value += 1;
        }
        return {
            a,
            change,
        };
    },
};
</script>

提示

目前还不支持 script setup

2023-9-14 更新
重启 search-pro,css 样式调整