Fork me on GitHub

vue3.0中ref动态绑定


// 自己使用

<div v-for="item in ['lisi','wanger']" :key="item">
  <test :ref="(el) => setGraphRef(el, item)" />
</div>


    const setGraphRef = (el, type) => {
      if (el) {
        itemRefs[type] = el;
      }
    };

// 调用
  const targetRef = itemRefs[item];
   if (targetRef) targetRef.testa();

 

// 官方的例子
<div v-for="item in list" :ref="setItemRef"></div>

import { onBeforeUpdate, onUpdated } from "vue";

export default {
  setup() {
    let itemRefs = [];
    const setItemRef = (el) => {
      if (el) {
        itemRefs.push(el);
      }
    };
    onBeforeUpdate(() => {
      itemRefs = [];
    });
    onUpdated(() => {
      console.log(itemRefs);
    });
    return {
      setItemRef,
    };
  },
};

 

posted @ 2022-11-21 16:00  欢欢11  阅读(1613)  评论(0编辑  收藏  举报