From ebbd788fbb2c0b45d4473798efc57eec8ba74a25 Mon Sep 17 00:00:00 2001
From: Ben Lin <maobin001@msn.com>
Date: 星期二, 18 六月 2024 14:51:16 +0800
Subject: [PATCH] 版本更新至2.11.5
---
src/views/demo/feat/click-out-side/index.vue | 48 ++++++++++++++++--------------------------------
1 files changed, 16 insertions(+), 32 deletions(-)
diff --git a/src/views/demo/feat/click-out-side/index.vue b/src/views/demo/feat/click-out-side/index.vue
index 5d01d56..8e87a5f 100644
--- a/src/views/demo/feat/click-out-side/index.vue
+++ b/src/views/demo/feat/click-out-side/index.vue
@@ -1,43 +1,27 @@
<template>
<PageWrapper title="鐐瑰唴澶栭儴瑙﹀彂浜嬩欢">
<ClickOutSide @click-outside="handleClickOutside" class="flex justify-center">
- <div @click="innerClick" class="demo-box">
+ <div
+ @click="innerClick"
+ class="flex items-center justify-center w-full h-300px border-10px bg-blue-500 text-white text-24px"
+ >
{{ text }}
</div>
</ClickOutSide>
</PageWrapper>
</template>
-<script lang="ts">
- import { defineComponent, ref } from 'vue';
- import { ClickOutSide } from '/@/components/ClickOutSide';
- import { PageWrapper } from '/@/components/Page';
+<script lang="ts" setup>
+ import { ref } from 'vue';
+ import { ClickOutSide } from '@/components/ClickOutSide';
+ import { PageWrapper } from '@/components/Page';
- export default defineComponent({
- components: { ClickOutSide, PageWrapper },
- setup() {
- const text = ref('Click');
- function handleClickOutside() {
- text.value = 'Click Out Side';
- }
+ const text = ref('Click');
- function innerClick() {
- text.value = 'Click Inner';
- }
- return { innerClick, handleClickOutside, text };
- },
- });
-</script>
-
-<style lang="less" scoped>
- .demo-box {
- display: flex;
- align-items: center;
- justify-content: center;
- width: 100%;
- height: 300px;
- border-radius: 10px;
- background-color: #408ede;
- color: #fff;
- font-size: 24px;
+ function handleClickOutside() {
+ text.value = 'Click Out Side';
}
-</style>
+
+ function innerClick() {
+ text.value = 'Click Inner';
+ }
+</script>
--
Gitblit v1.9.3