ci: 新增 interface , tools, use 文件夹
This commit is contained in:
parent
8bb751699f
commit
fcb36ec87a
@ -93,7 +93,7 @@ export default {
|
||||
|
||||
const disabled = ref(true)
|
||||
|
||||
const checked6 = ref(true);
|
||||
const checked6 = ref(false);
|
||||
|
||||
return {
|
||||
disabled,checked6
|
||||
|
@ -32,9 +32,10 @@
|
||||
|
||||
<script setup name="LaySelect" lang="ts">
|
||||
import { defineProps, ref, watch } from 'vue'
|
||||
import useClickOutside from '../use/useClickOutside'
|
||||
import useClickOutside from '../../use/useClickOutside'
|
||||
|
||||
const dropdownRef = ref<null | HTMLElement>(null)
|
||||
const isClickOutside = useClickOutside(dropdownRef)
|
||||
|
||||
const props = withDefaults(
|
||||
defineProps<{
|
||||
@ -50,10 +51,7 @@ const openState = ref(false)
|
||||
const open = function () {
|
||||
openState.value = !openState.value
|
||||
}
|
||||
// 控制点击事件
|
||||
const isClickOutside = useClickOutside(dropdownRef)
|
||||
|
||||
// 通过 watch 去监听事件的变化
|
||||
watch(isClickOutside, () => {
|
||||
if (isClickOutside.value) {
|
||||
openState.value = false
|
||||
|
@ -2,16 +2,16 @@
|
||||
<div class="layui-tab" :class="[type ? 'layui-tab-' + type : '']">
|
||||
<ul class="layui-tab-title">
|
||||
<li
|
||||
v-for="ss in slots"
|
||||
:key="ss"
|
||||
:class="[ss.props.id === active ? 'layui-this' : '']"
|
||||
@click.stop="change(ss.props.id)"
|
||||
v-for="s in slots"
|
||||
:key="s"
|
||||
:class="[s.props.id === active ? 'layui-this' : '']"
|
||||
@click.stop="change(s.props.id)"
|
||||
>
|
||||
{{ ss.props.title }}
|
||||
{{ s.props.title }}
|
||||
<i
|
||||
v-if="allowClose"
|
||||
class="layui-icon layui-icon-close layui-unselect layui-tab-close"
|
||||
@click.stop="close(ss.props.id)"
|
||||
@click.stop="close(s.props.id)"
|
||||
></i>
|
||||
</li>
|
||||
</ul>
|
||||
@ -21,10 +21,16 @@
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup name="LayTab" lang="ts">
|
||||
<script lang="ts">
|
||||
export default {
|
||||
name: 'LayTab',
|
||||
}
|
||||
</script>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { computed, defineProps, provide, ref, useSlots } from 'vue'
|
||||
|
||||
const slot = useSlots() as any
|
||||
const slot = useSlots()
|
||||
const slots = slot.default && slot.default()
|
||||
|
||||
const props = defineProps<{
|
||||
@ -33,7 +39,6 @@ const props = defineProps<{
|
||||
allowClose?: boolean
|
||||
}>()
|
||||
|
||||
// select update 时, 通知 change 事件
|
||||
const emit = defineEmits(['update:modelValue', 'change', 'close'])
|
||||
|
||||
const active = computed({
|
||||
|
@ -4,8 +4,14 @@
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
export default {
|
||||
name: 'LayTabItem',
|
||||
}
|
||||
</script>
|
||||
|
||||
<script setup name="LayTabItem" lang="ts">
|
||||
import { defineProps, inject, useSlots } from 'vue'
|
||||
import { defineProps, inject } from 'vue'
|
||||
|
||||
const props = defineProps<{
|
||||
id?: string
|
||||
@ -13,3 +19,5 @@ const props = defineProps<{
|
||||
|
||||
const active = inject('active')
|
||||
</script>
|
||||
|
||||
|
||||
|
@ -10,9 +10,7 @@ export type IDefineComponent<Props = UnknownObject> = DefineComponent<Props> & {
|
||||
}
|
||||
|
||||
export interface InstallOptions extends StringObject {
|
||||
/** Pagination Attributes */
|
||||
pagination?: null
|
||||
/** Menu Attributes */
|
||||
menu?: null
|
||||
}
|
||||
|
||||
|
@ -1,10 +1,9 @@
|
||||
import { ref, onMounted, onUnmounted, Ref } from 'vue'
|
||||
|
||||
// 案例详见 tab.vue
|
||||
const useClickOutside = (elementRef: Ref<HTMLElement | null>) => {
|
||||
|
||||
// 设置一个导出值
|
||||
const isClickOutside = ref(false);
|
||||
|
||||
// 给界面绑定上事件
|
||||
const handler = (e: MouseEvent) => {
|
||||
if (elementRef.value) {
|
||||
@ -25,5 +24,4 @@ const useClickOutside = (elementRef: Ref<HTMLElement | null>) => {
|
||||
});
|
||||
return isClickOutside;
|
||||
}
|
||||
|
||||
export default useClickOutside;
|
Loading…
x
Reference in New Issue
Block a user