当前位置: 首页 > 网络应用技术

以Elementui的回归为示例来谈论如何打包VUE组件

时间:2023-03-06 22:36:58 网络应用技术

  本文列出的包装组件的步骤基于元素UI返回到顶部组件的返回,但不完全限制它(至少您可以进行参考)。显示的演示也进行了一些修改。

  以下答案仅是个人对VUE组件包装的见解。这不一定是正确的。如果有任何不适当的人,请理解。

  这个问题被很好地理解了。简单地说,您要打包的组件用于包装什么。那么本文返回到顶部按钮的返回哪种组件?答案很明显。这是一个功能组件,因为设计的目的是允许用户通过单击从页面底部从底部返回顶部。

  只需澄清您封装的组件的位置吗?以备用按钮为例,然后使用主场景:页面内容很长,您需要向下滚动并浏览,当您返回顶部时,您可以一步一步到位(不花手指鼠标向上滚动)。

  此步骤通常用于包装装饰组件。例如,按钮组件通常具有以下状态:

  至于顶部按钮的形式的组件,我们只需要一个默认状态(即初始化)。例如,距底部或右距离的距离是多少当滚动高度达到滚动高度时显示。

  它主要是指显示包装的组件(即CSS样式)。从总体上讲,按钮组件将具有一些形状和动画效果,例如

  然后我们回到顶部按钮组件,我们计划使开发人员通过切片设计。这样的组件样式不仅可以固定在几种有限类型上,但色彩鲜艳。

  在正常情况下,按钮的组件具有多种不同的选择。

  因为有必要使开发人员进行自定义,因此无需在此处故意设计可选尺寸。

  通常,将VUE组件封装时,将设置某些事件监视功能以实现某些操作。

  通过上面的一系列分析,我们可以公开以下属性和事件监控功能。

  属性

  目标触发器滚动对象字符串visibility-Height-Height滚动高度在数字200RIGHT控制其显示位置之前达到此参数值,页面的右侧由Number40Bottom(距页面页面底部的距离)控制

  单击点击事件触发的事件。请注意,整个组件除了将过渡动画属性添加到它外,没有其他更改。

  代码中引入的节气门函数主要是为了防止用户重复点击按钮以触发滚动功能。每个人都可以通过项目介绍,或者正如我在代码中所写的那样:逐文件介绍,前提是您必须下载首先(您准备的演示可用,您可以自己拿走)。如果您对th动和摇动感兴趣,则可能希望看到我写的相关文章。

  Elementui的返回顶部组件没有过渡动画属性。在这里,我将其更改一点并将其添加到它上(完全复制,太糟糕了,只要添加一个,呵呵...)。

  文章中没有深入的讨论,主要是与我的同学分享我的个人包装vue组件的感觉。如果有问题,请对待它。