mirror of
https://gitee.com/vant-contrib/vant.git
synced 2025-08-15 08:39:45 +08:00
chore(Sidebar): improve code
This commit is contained in:
parent
e686738fd5
commit
d0a3726bbb
@ -1,4 +1,4 @@
|
|||||||
import { ref, computed } from 'vue';
|
import { ref } from 'vue';
|
||||||
import { createNamespace } from '../utils';
|
import { createNamespace } from '../utils';
|
||||||
import { route, routeProps } from '../utils/router';
|
import { route, routeProps } from '../utils/router';
|
||||||
import { useParent } from '../api/use-relation';
|
import { useParent } from '../api/use-relation';
|
||||||
@ -21,10 +21,9 @@ export default createComponent({
|
|||||||
setup(props, { emit }) {
|
setup(props, { emit }) {
|
||||||
const { parent, index } = useParent(SIDEBAR_KEY, ref());
|
const { parent, index } = useParent(SIDEBAR_KEY, ref());
|
||||||
|
|
||||||
const selected = computed(() => index.value === +parent.active());
|
|
||||||
|
|
||||||
return (vm) => {
|
return (vm) => {
|
||||||
const { dot, badge, title, disabled } = props;
|
const { dot, badge, title, disabled } = props;
|
||||||
|
const selected = index.value === parent.active();
|
||||||
|
|
||||||
const onClick = () => {
|
const onClick = () => {
|
||||||
if (disabled) {
|
if (disabled) {
|
||||||
@ -33,7 +32,7 @@ export default createComponent({
|
|||||||
|
|
||||||
emit('click', index.value);
|
emit('click', index.value);
|
||||||
parent.emit('update:modelValue', index.value);
|
parent.emit('update:modelValue', index.value);
|
||||||
parent.setIndex(index.value);
|
parent.setActive(index.value);
|
||||||
route(vm.$router, vm);
|
route(vm.$router, vm);
|
||||||
};
|
};
|
||||||
|
|
||||||
|
@ -17,25 +17,21 @@ export default createComponent({
|
|||||||
|
|
||||||
setup(props, { emit, slots }) {
|
setup(props, { emit, slots }) {
|
||||||
const children = ref([]);
|
const children = ref([]);
|
||||||
const index = ref(+props.modelValue);
|
const active = () => +props.modelValue;
|
||||||
const active = () => props.modelValue;
|
|
||||||
|
|
||||||
const setIndex = (value) => {
|
const setActive = (value) => {
|
||||||
if (value !== index.value) {
|
if (value !== active()) {
|
||||||
index.value = value;
|
|
||||||
emit('change', value);
|
emit('change', value);
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
watch(active, (value) => {
|
watch(active, setActive);
|
||||||
setIndex(+value);
|
|
||||||
});
|
|
||||||
|
|
||||||
provide(SIDEBAR_KEY, {
|
provide(SIDEBAR_KEY, {
|
||||||
emit,
|
emit,
|
||||||
active,
|
active,
|
||||||
children,
|
children,
|
||||||
setIndex,
|
setActive,
|
||||||
});
|
});
|
||||||
|
|
||||||
return () => <div class={bem()}>{slots.default?.()}</div>;
|
return () => <div class={bem()}>{slots.default?.()}</div>;
|
||||||
|
Loading…
x
Reference in New Issue
Block a user