vue3 ref

<vue-cropper
        ref="cropper"
        :src="imgSrc"
        :ready="cropImage"
        :zoom="cropImage"
        :cropmove="cropImage"
        style="width: 100%; height: 400px"
      ></vue-cropper>

const cropper = ref(null);

const setImage = (e) => {
      const file = e.target.files[0];
      if (!file.type.includes("image/")) {
        return;
      }
      const reader = new FileReader();
      reader.onload = (event) => {
        dialogVisible.value = true;
        imgSrc.value = event.target.result;
        cropper.value && cropper.value.replace(event.target.result);
      };
      reader.readAsDataURL(file);
    };

为什么需要在vue-cropper组件里定义一个ref属性呢

阅读 1.7k
1 个回答

因为你在这里调用了这个组件暴露的方法:

cropper.value && cropper.value.replace(event.target.result);

对于在 setup 中如何引用模版,可以看官方文档:https://v3.cn.vuejs.org/guide...

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题