js css html

命令式与声明式

2022-12-31  本文已影响0人  alue

之前对 组合函数(Composables )的理解还是不到位, 最近看了Soybean Admin的开源代码, 对这方面增长认识.

例如, 封装 Echarts, 如果是我自己写useMyEcharts(),肯定是吧 dom的ref当做参数传递给封装函数 , 大概是

export function useMyEcharts(domRef,options,renderFun){}

而Soybean Admin则是将 domRef 当做返回值

export function useEcharts(options,renderFun){
    const domRef=ref()
    return {
        domRef
  };
}

虽然二者都能够实现,但后者看上去更高级. 调用的时候, 只用一行

const { domRef: mapRef } = useEcharts(mapOptions, renderFunc);

而我的封装,却需要两行

const mapRef = ref(null);
useMyEcharts(mapRef, mapOptions, renderFunc);

表面上看上去, 就是多一行代码, 实际上是我对数据驱动理念的运用还不够娴熟. 自己写出来的代码还大多是"命令式"的, 没有掌握vue"声明式"编程的精髓.

上一篇 下一篇

猜你喜欢

热点阅读