自学内容网 自学内容网

vue3前端开发-小兔鲜项目-关于详情页图片渲染的一些技术

vue3前端开发-小兔鲜项目-关于详情页图片渲染的一些技术!经过前面几天的努力,我们现在已经可以正常渲染产品详情了。是时候汇总一下,基础的技术知识点了。


1:单页面组件内的抽离,是一种很重要的思想。当我们遇到了,一个组件,在不同的业务场景内都需要使用它,它就应该被抽离出来,单独设计成一个组件。这是代码复用的思想。


2:当一个组件内部可能会需要渲染不同的内容(但是类型一致)的情况下,就需要考虑使用props对象了。

自定义一个props对象,来完成这种业务需求。这个组件内部自定义的props对象,可以帮助我们很好的解决这种业务需求。

比如这一次,在图片组件内,需要渲染产品的缩略图,就是这样的案例。

我们自己定义了一个imageList。在其它组件内调用这个组件的时候,我们只需要给它动态赋值就行了。


如图,在产品详情的页面组件内,调用这个图片显示的组件,给它绑定这个动态参数值就行了。


vue3的核心优势,就是代码复用。可以把功能相同的代码抽离成一个独立的组件。实现多场景下的复用。

还可以借助于pinia(状态管理插件)实现,业务组件内部的数据状态管理。之前vue2的时候,是vuex。现在到了vue3版本后,换成了pinia。有所提升和简略,使用起来更加便捷高效了。


原文地址:https://blog.csdn.net/yrldjsbk/article/details/140663289

免责声明:本站文章内容转载自网络资源,如本站内容侵犯了原著者的合法权益,可联系本站删除。更多内容请关注自学内容网(zxcms.com)!