mirror of
https://gitee.com/vant-contrib/vant.git
synced 2025-04-06 03:57:59 +08:00
chore: children use reactive
This commit is contained in:
parent
326c345c91
commit
b0ea4bc1f6
@ -24,16 +24,14 @@ export default createComponent({
|
|||||||
|
|
||||||
const isFirst = computed(() => {
|
const isFirst = computed(() => {
|
||||||
if (parent) {
|
if (parent) {
|
||||||
const children = parent.children.value;
|
const prev = parent.children[index.value - 1];
|
||||||
const prev = children[index.value - 1];
|
|
||||||
return !(prev && prev.isButton);
|
return !(prev && prev.isButton);
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
const isLast = computed(() => {
|
const isLast = computed(() => {
|
||||||
if (parent) {
|
if (parent) {
|
||||||
const children = parent.children.value;
|
const next = parent.children[index.value + 1];
|
||||||
const next = children[index.value + 1];
|
|
||||||
return !(next && next.isButton);
|
return !(next && next.isButton);
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
@ -1,4 +1,4 @@
|
|||||||
import { ref, provide } from 'vue';
|
import { provide, reactive } from 'vue';
|
||||||
import { createNamespace } from '../utils';
|
import { createNamespace } from '../utils';
|
||||||
|
|
||||||
const [createComponent, bem] = createNamespace('action-bar');
|
const [createComponent, bem] = createNamespace('action-bar');
|
||||||
@ -14,9 +14,9 @@ export default createComponent({
|
|||||||
},
|
},
|
||||||
|
|
||||||
setup(props, { slots }) {
|
setup(props, { slots }) {
|
||||||
provide(ACTION_BAR_KEY, {
|
const children = reactive([]);
|
||||||
children: ref([]),
|
|
||||||
});
|
provide(ACTION_BAR_KEY, { children });
|
||||||
|
|
||||||
return () => (
|
return () => (
|
||||||
<div class={bem({ unfit: !props.safeAreaInsetBottom })}>
|
<div class={bem({ unfit: !props.safeAreaInsetBottom })}>
|
||||||
|
@ -1,14 +1,14 @@
|
|||||||
import { Ref, inject, computed, onUnmounted } from 'vue';
|
import { inject, computed, onUnmounted } from 'vue';
|
||||||
|
|
||||||
export type Parent<T = unknown> = null | {
|
export type Parent<T = unknown> = null | {
|
||||||
children: Ref<T[]>;
|
children: T[];
|
||||||
};
|
};
|
||||||
|
|
||||||
export function useParent<T = unknown>(key: string, child: T = {} as T) {
|
export function useParent<T = unknown>(key: string, child: T = {} as T) {
|
||||||
const parent = inject<Parent<T>>(key, null);
|
const parent = inject<Parent<T>>(key, null);
|
||||||
|
|
||||||
if (parent) {
|
if (parent) {
|
||||||
const children = parent.children.value;
|
const { children } = parent;
|
||||||
const index = computed(() => children.indexOf(child));
|
const index = computed(() => children.indexOf(child));
|
||||||
|
|
||||||
children.push(child);
|
children.push(child);
|
||||||
|
@ -1,4 +1,4 @@
|
|||||||
import { ref, provide } from 'vue';
|
import { provide, reactive } from 'vue';
|
||||||
import { createNamespace } from '../utils';
|
import { createNamespace } from '../utils';
|
||||||
import { BORDER_TOP_BOTTOM } from '../utils/constant';
|
import { BORDER_TOP_BOTTOM } from '../utils/constant';
|
||||||
|
|
||||||
@ -19,7 +19,7 @@ export default createComponent({
|
|||||||
emits: ['change', 'update:modelValue'],
|
emits: ['change', 'update:modelValue'],
|
||||||
|
|
||||||
setup(props, { emit, slots }) {
|
setup(props, { emit, slots }) {
|
||||||
const children = ref([]);
|
const children = reactive([]);
|
||||||
|
|
||||||
const toggle = (name, expanded) => {
|
const toggle = (name, expanded) => {
|
||||||
const { accordion, modelValue } = props;
|
const { accordion, modelValue } = props;
|
||||||
|
@ -1,4 +1,4 @@
|
|||||||
import { ref, computed, provide } from 'vue';
|
import { provide, computed, reactive } from 'vue';
|
||||||
import { createNamespace } from '../utils';
|
import { createNamespace } from '../utils';
|
||||||
|
|
||||||
const [createComponent, bem] = createNamespace('row');
|
const [createComponent, bem] = createNamespace('row');
|
||||||
@ -21,13 +21,13 @@ export default createComponent({
|
|||||||
},
|
},
|
||||||
|
|
||||||
setup(props, { slots }) {
|
setup(props, { slots }) {
|
||||||
const children = ref([]);
|
const children = reactive([]);
|
||||||
|
|
||||||
const groups = computed(() => {
|
const groups = computed(() => {
|
||||||
const groups = [[]];
|
const groups = [[]];
|
||||||
|
|
||||||
let totalSpan = 0;
|
let totalSpan = 0;
|
||||||
children.value.forEach((getSpan, index) => {
|
children.forEach((getSpan, index) => {
|
||||||
totalSpan += getSpan();
|
totalSpan += getSpan();
|
||||||
|
|
||||||
if (totalSpan > 24) {
|
if (totalSpan > 24) {
|
||||||
|
@ -1,4 +1,4 @@
|
|||||||
import { ref, watch, provide } from 'vue';
|
import { watch, provide, reactive } from 'vue';
|
||||||
import { createNamespace } from '../utils';
|
import { createNamespace } from '../utils';
|
||||||
|
|
||||||
const [createComponent, bem] = createNamespace('sidebar');
|
const [createComponent, bem] = createNamespace('sidebar');
|
||||||
@ -16,7 +16,7 @@ export default createComponent({
|
|||||||
emits: ['change', 'update:modelValue'],
|
emits: ['change', 'update:modelValue'],
|
||||||
|
|
||||||
setup(props, { emit, slots }) {
|
setup(props, { emit, slots }) {
|
||||||
const children = ref([]);
|
const children = reactive([]);
|
||||||
const active = () => +props.modelValue;
|
const active = () => +props.modelValue;
|
||||||
const setActive = (value) => {
|
const setActive = (value) => {
|
||||||
if (value !== active()) {
|
if (value !== active()) {
|
||||||
|
Loading…
x
Reference in New Issue
Block a user