fix(Image): loading placeholder not work

This commit is contained in:
chenjiahan 2020-08-26 16:24:02 +08:00
parent eb0cc05b12
commit c720eea831
6 changed files with 14 additions and 15 deletions

View File

@ -48,7 +48,7 @@ export default createComponent({
emits: ['change', 'confirm'], emits: ['change', 'confirm'],
setup(props, { emit, slots }) { setup(props, { emit, slots }) {
const pickerRef = ref(null); const pickerRef = ref();
const state = reactive({ const state = reactive({
code: props.value, code: props.value,

View File

@ -46,8 +46,8 @@ export default createComponent({
setup(props, { emit }) { setup(props, { emit }) {
const [visible, setVisible] = useToggle(); const [visible, setVisible] = useToggle();
const daysRef = ref(null); const daysRef = ref();
const monthRef = ref(null); const monthRef = ref();
const title = computed(() => formatMonthTitle(props.date)); const title = computed(() => formatMonthTitle(props.date));

View File

@ -27,8 +27,8 @@ export default createComponent({
}, },
setup(props, { slots }) { setup(props, { slots }) {
const wrapperRef = ref(null); const wrapperRef = ref();
const contentRef = ref(null); const contentRef = ref();
const { parent, index } = useParent(COLLAPSE_KEY); const { parent, index } = useParent(COLLAPSE_KEY);
const currentName = computed(() => const currentName = computed(() =>

View File

@ -37,7 +37,7 @@ export default createComponent({
setup(props, { emit, slots }) { setup(props, { emit, slots }) {
const error = ref(false); const error = ref(false);
const loading = ref(true); const loading = ref(true);
const imageRef = ref(null); const imageRef = ref();
const style = computed(() => { const style = computed(() => {
const style = {}; const style = {};
@ -94,11 +94,10 @@ export default createComponent({
}; };
const renderPlaceholder = () => { const renderPlaceholder = () => {
if (props.loading && props.showLoading) { if (loading.value && props.showLoading) {
return <div class={bem('loading')}>{renderLoadingIcon()}</div>; return <div class={bem('loading')}>{renderLoadingIcon()}</div>;
} }
if (error.value && props.showError) {
if (props.error && props.showError) {
return <div class={bem('error')}>{renderErrorIcon()}</div>; return <div class={bem('error')}>{renderErrorIcon()}</div>;
} }
}; };

View File

@ -30,8 +30,8 @@ export default createComponent({
emits: ['click-left', 'click-right'], emits: ['click-left', 'click-right'],
setup(props, { emit, slots }) { setup(props, { emit, slots }) {
const height = ref(null); const height = ref();
const navBarRef = ref(null); const navBarRef = ref();
onMounted(() => { onMounted(() => {
if (props.placeholder && props.fixed) { if (props.placeholder && props.fixed) {

View File

@ -24,12 +24,12 @@ export default createComponent({
}, },
setup(props) { setup(props) {
const rootRef = ref(null); const rootRef = ref();
const pivotRef = ref(null); const pivotRef = ref();
const state = reactive({ const state = reactive({
pivotWidth: 0,
rootWidth: 0, rootWidth: 0,
pivotWidth: 0,
}); });
const background = computed(() => const background = computed(() =>
@ -38,8 +38,8 @@ export default createComponent({
const setWidth = () => { const setWidth = () => {
nextTick(() => { nextTick(() => {
state.pivotWidth = pivotRef.value ? pivotRef.value.offsetWidth : 0;
state.rootWidth = rootRef.value.offsetWidth; state.rootWidth = rootRef.value.offsetWidth;
state.pivotWidth = pivotRef.value ? pivotRef.value.offsetWidth : 0;
}); });
}; };