之前对 组合函数(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"声明式"编程的精髓.
网友评论