docs: 梳理 transition 使用文档
This commit is contained in:
parent
0e4bc9dbb3
commit
d33042eade
@ -42,7 +42,7 @@ export default {
|
|||||||
|
|
||||||
:::
|
:::
|
||||||
|
|
||||||
::: title 基础使用
|
::: title 淡入淡出
|
||||||
:::
|
:::
|
||||||
|
|
||||||
::: demo 使用 `lay-transition` 标签, 为元素提供过渡动画
|
::: demo 使用 `lay-transition` 标签, 为元素提供过渡动画
|
||||||
@ -75,4 +75,27 @@ export default {
|
|||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
:::
|
||||||
|
|
||||||
|
::: title Transition 属性
|
||||||
|
:::
|
||||||
|
|
||||||
|
::: table
|
||||||
|
|
||||||
|
| 属性 | 描述 | 类型 |默认值 | 可选值 |
|
||||||
|
| ------------ | ---------------- | ------------- | ---- | ---- |
|
||||||
|
| enable | 启用 | `boolean` | `true` | `true` `false` |
|
||||||
|
| type | 类型 | `string` | `collapse` | -- |
|
||||||
|
|
||||||
|
:::
|
||||||
|
|
||||||
|
::: title Transition 属性值
|
||||||
|
:::
|
||||||
|
|
||||||
|
::: table
|
||||||
|
|
||||||
|
| 属性值 | 描述 |
|
||||||
|
| ------------ | ---------------- |
|
||||||
|
| collapse | 折叠动画 |
|
||||||
|
| fade | 淡入淡出 |
|
||||||
:::
|
:::
|
@ -17,7 +17,7 @@
|
|||||||
<h3>0.4.3 <span class="layui-badge-rim">2022-03-27</span></h3>
|
<h3>0.4.3 <span class="layui-badge-rim">2022-03-27</span></h3>
|
||||||
<ul>
|
<ul>
|
||||||
<li>[修复] menu 组件 level 属性不生效。</li>
|
<li>[修复] menu 组件 level 属性不生效。</li>
|
||||||
<li>[修复] step 组件 line 连线不显示。
|
<li>[修复] step 组件 line 连线不显示。</li>
|
||||||
</ul>
|
</ul>
|
||||||
</li>
|
</li>
|
||||||
</ul>
|
</ul>
|
||||||
|
@ -23,6 +23,13 @@ const getYear = () => {
|
|||||||
return getDate().getFullYear();
|
return getDate().getFullYear();
|
||||||
};
|
};
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 获取当前月份
|
||||||
|
*/
|
||||||
|
const getMonth = () => {
|
||||||
|
return getDate().getMonth();
|
||||||
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* 获取月份天数
|
* 获取月份天数
|
||||||
*
|
*
|
||||||
@ -33,4 +40,4 @@ const getDayLength = (year: number, month: number): number => {
|
|||||||
return new Date(year, month + 1, 0).getDate();
|
return new Date(year, month + 1, 0).getDate();
|
||||||
};
|
};
|
||||||
|
|
||||||
export { getDayLength, getYears };
|
export { getDayLength, getYears, getDate, getMonth, getYear };
|
||||||
|
@ -242,25 +242,13 @@ import {
|
|||||||
} from "vue";
|
} from "vue";
|
||||||
import LayInput from "../input/index.vue";
|
import LayInput from "../input/index.vue";
|
||||||
import LayDropdown from "../dropdown/index.vue";
|
import LayDropdown from "../dropdown/index.vue";
|
||||||
import { getDayLength, getYears } from "./day";
|
import { getDayLength, getYears, getDate, getMonth, getYear } from "./day";
|
||||||
|
|
||||||
const $emits = defineEmits(["update:modelValue"]);
|
const $emits = defineEmits(["update:modelValue"]);
|
||||||
|
|
||||||
const WEEK_NAME = ["日", "一", "二", "三", "四", "五", "六"];
|
const WEEK_NAME = ["日", "一", "二", "三", "四", "五", "六"];
|
||||||
const MONTH_NAME = [
|
const MONTH_NAME = ["1月","2月","3月","4月","5月","6月","7月","8月","9月","10月","11月","12月"];
|
||||||
"1月",
|
|
||||||
"2月",
|
|
||||||
"3月",
|
|
||||||
"4月",
|
|
||||||
"5月",
|
|
||||||
"6月",
|
|
||||||
"7月",
|
|
||||||
"8月",
|
|
||||||
"9月",
|
|
||||||
"10月",
|
|
||||||
"11月",
|
|
||||||
"12月",
|
|
||||||
];
|
|
||||||
const hms = ref({ hh: "00", mm: "00", ss: "00" });
|
const hms = ref({ hh: "00", mm: "00", ss: "00" });
|
||||||
const els = [
|
const els = [
|
||||||
{ count: 24, type: "hh" },
|
{ count: 24, type: "hh" },
|
||||||
@ -278,9 +266,9 @@ const props = withDefaults(defineProps<LayDatePickerProps>(), {
|
|||||||
type: "date",
|
type: "date",
|
||||||
});
|
});
|
||||||
|
|
||||||
const currentDate = new Date();
|
const currentDate = getDate();
|
||||||
const currentYear = ref(currentDate.getFullYear());
|
const currentYear = ref(getYear());
|
||||||
const currentMonth = ref(currentDate.getMonth());
|
const currentMonth = ref(getMonth());
|
||||||
|
|
||||||
const yearList = ref<number[]>(getYears());
|
const yearList = ref<number[]>(getYears());
|
||||||
const dateList = ref<any[]>([]);
|
const dateList = ref<any[]>([]);
|
||||||
|
Loading…
x
Reference in New Issue
Block a user