数据动态效果的实现方法、装置、电子设备及存储介质与流程

本申请涉及计算机，尤其涉及一种数据动态效果的实现方法、装置、电子设备及存储介质。

背景技术：

1、vue是一套用于构建用户界面的渐进式javascript框架。组件(component)是vue.js最强大的功能之一。组件可以扩展html元素，封装可重用的代码。组件系统可以用独立可复用的小组件来构建大型应用。

2、目前几乎所有的web可视化项目追求的界面炫，其实就是动画效果要好，现有技术中如果一些文本的显示，比如标题，如果将文本同时显示出来，就会显得很生硬。

3、现有技术中无法实现基于vue根据文本字数实现动态显示效果组件，不方便用户在多个页面引用，在每个页如果需要显示同样的效果都要对每个页面处业务逻辑，操作繁琐。

技术实现思路

1、本申请提供一种数据动态效果的实现方法、装置、电子设备及存储介质，以解决相关技术中在前端页面中需要手动开发对应的功能组件，导致生成前端页面的效率比较低的问题。

2、为达到上述目的，本申请采用如下技术方案：

3、第一方面，提供一种数据动态效果的实现方法，该方法包括：响应于用户在前端数据开发页面的目标vue插件安装操作，安装目标vue插件，并在前端数据开发页面激活目标vue插件对应的数据动态效果组件库；数据动态效果组件库包括多个动态效果功能组件；一个动态效果功能组件对应一个动态效果参数；响应于用户在目标vue插件中输入的动态效果指令，确定动态效果指令的输入参数；确定与输入参数相同的目标动态效果参数，并显示目标动态效果参数对应的目标动态效果。

4、可选的，方法还包括：创建数据动态效果项目的目录结构，目录结构中设置有组件文件夹；根据数据动态效果项目的展示需求，将需要开发的组件至少拆分为动态效果功能组件、动画效果功能组件、动画优化功能组件、过渡效果功能组件；使用vue开发动态效果功能组件、动画效果功能组件、动画优化功能组件、过渡效果功能组件；将开发完成的组件存放在组件文件夹中；在数据动态效果项目开发完成后，至少将数据动态效果项目中的组件打包并发布，以得到能够供前端用户下载使用的数据动态效果组件库。

5、可选的，使用vue开发动态效果功能组件、动画效果功能组件、动画优化功能组件、过渡效果功能组件，包括：获取开发人员输入的动态效果配置文件；动态效果配置文件包括第一vue代码；响应于封装指令，封装第一vue代码，得到动态效果功能组件；获取开发人员输入的动画效果配置文件；动画效果配置文件包括第二vue代码；响应于封装指令，封装第二vue代码，得到动画效果功能组件；获取开发人员输入的动画优化配置文件；动画优化配置文件包括第三vue代码；响应于封装指令，封装第三vue代码，得到动画优化功能组件；获取开发人员输入的过渡效果配置文件；过渡效果配置文件包括第四vue代码；响应于封装指令，封装第四vue代码，得到过渡效果功能组件。

6、可选的，第一vue代码包括动态效果的第一配置参数，第一配置参数包括动态效果的持续时间、旋转角度、缩放比例；第二vue代码包括动画效果的第二配置参数，第二配置参数包括动画效果的渲染方式、播放方式；第三vue代码包括动画优化的第三配置参数，第三配置参数包括动画优化的动画曲线调整方式；第四vue代码包括过渡效果的第四配置参数，第四配置参数包括过渡效果的颜色变化、大小变化。

7、第二方面，提供一种数据动态效果的实现装置，该装置包括处理单元、确定单元以及显示单元；处理单元，用于响应于用户在前端数据开发页面的目标vue插件安装操作，安装目标vue插件，并在前端数据开发页面激活目标vue插件对应的数据动态效果组件库；数据动态效果组件库包括多个动态效果功能组件；一个动态效果功能组件对应一个动态效果参数；确定单元，用于响应于用户在目标vue插件中输入的动态效果指令，确定动态效果指令的输入参数；显示单元，用于确定与输入参数相同的目标动态效果参数，并显示目标动态效果参数对应的目标动态效果。

8、可选的，处理单元还用于：创建数据动态效果项目的目录结构，目录结构中设置有组件文件夹；根据数据动态效果项目的展示需求，将需要开发的组件至少拆分为动态效果功能组件、动画效果功能组件、动画优化功能组件、过渡效果功能组件；使用vue开发动态效果功能组件、动画效果功能组件、动画优化功能组件、过渡效果功能组件；将开发完成的组件存放在组件文件夹中；在数据动态效果项目开发完成后，至少将数据动态效果项目中的组件打包并发布，以得到能够供前端用户下载使用的数据动态效果组件库。

9、可选的，处理单元，具体用于：获取开发人员输入的动态效果配置文件；动态效果配置文件包括第一vue代码；响应于封装指令，封装第一vue代码，得到动态效果功能组件；获取开发人员输入的动画效果配置文件；动画效果配置文件包括第二vue代码；响应于封装指令，封装第二vue代码，得到动画效果功能组件；获取开发人员输入的动画优化配置文件；动画优化配置文件包括第三vue代码；响应于封装指令，封装第三vue代码，得到动画优化功能组件；获取开发人员输入的过渡效果配置文件；过渡效果配置文件包括第四vue代码；响应于封装指令，封装第四vue代码，得到过渡效果功能组件。

10、可选的，第一vue代码包括动态效果的第一配置参数，第一配置参数包括动态效果的持续时间、旋转角度、缩放比例；第二vue代码包括动画效果的第二配置参数，第二配置参数包括动画效果的渲染方式、播放方式；第三vue代码包括动画优化的第三配置参数，第三配置参数包括动画优化的动画曲线调整方式；第四vue代码包括过渡效果的第四配置参数，第四配置参数包括过渡效果的颜色变化、大小变化。

11、第三方面，提供一种电子设备，包括：处理器、用于存储处理器可执行的指令的存储器；其中，处理器被配置为执行指令，以实现上述第一方面的数据动态效果的实现方法。

12、第四方面，提供一种计算机可读存储介质，计算机可读存储介质上存储有指令，当计算机可读存储介质中的指令由电子设备的处理器执行时，使得电子设备能够执行如上述第一方面的数据动态效果的实现方法。

13、本申请实施例提供的技术方案至少带来以下有益效果：响应于用户在前端数据开发页面的目标vue插件安装操作，安装目标vue插件，并在前端数据开发页面激活目标vue插件对应的数据动态效果组件库。由于数据动态效果组件库包括多个动态效果功能组件，一个动态效果功能组件对应一个动态效果参数。因此，响应于用户在目标vue插件中输入的动态效果指令，确定动态效果指令的输入参数，确定与输入参数相同的目标动态效果参数，并显示目标动态效果参数对应的目标动态效果。这样一来，用户在进行前端开发时仅需输入动态效果指令，以将想要实现的动态效果的参数赋予到动态效果指令中，即可以调用相应的动态效果功能组件，实现对应的动态效果，避免了手动开发对应的功能组件，进而达到了提高生成前端页面的效率的效果。

技术特征：

1.一种数据动态效果的实现方法，其特征在于，所述方法包括：

2.根据权利要求1所述的方法，其特征在于，所述方法还包括：

3.根据权利要求2所述的方法，其特征在于，所述使用vue开发所述动态效果功能组件、所述动画效果功能组件、所述动画优化功能组件、所述过渡效果功能组件，包括：

4.根据权利要求3所述的方法，其特征在于，所述第一vue代码包括动态效果的第一配置参数，所述第一配置参数包括动态效果的持续时间、旋转角度、缩放比例；所述第二vue代码包括动画效果的第二配置参数，所述第二配置参数包括动画效果的渲染方式、播放方式；所述第三vue代码包括动画优化的第三配置参数，所述第三配置参数包括动画优化的动画曲线调整方式；所述第四vue代码包括过渡效果的第四配置参数，所述第四配置参数包括过渡效果的颜色变化、大小变化。

5.一种数据动态效果的实现装置，其特征在于，所述装置包括处理单元、确定单元以及显示单元；

6.根据权利要求5所述的装置，其特征在于，所述处理单元还用于：

7.根据权利要求6所述的装置，其特征在于，所述处理单元，具体用于：

8.根据权利要求7所述的装置，其特征在于，所述第一vue代码包括动态效果的第一配置参数，所述第一配置参数包括动态效果的持续时间、旋转角度、缩放比例；所述第二vue代码包括动画效果的第二配置参数，所述第二配置参数包括动画效果的渲染方式、播放方式；所述第三vue代码包括动画优化的第三配置参数，所述第三配置参数包括动画优化的动画曲线调整方式；所述第四vue代码包括过渡效果的第四配置参数，所述第四配置参数包括过渡效果的颜色变化、大小变化。

9.一种电子设备，其特征在于，包括：处理器、用于存储所述处理器可执行的指令的存储器；其中，所述处理器被配置为执行指令，以实现权利要求1-4中任一项所述的数据动态效果的实现方法。

10.一种计算机可读存储介质，所述计算机可读存储介质上存储有指令，其特征在于，当所述计算机可读存储介质中的指令由电子设备的处理器执行时，使得所述电子设备能够执行如权利要求1-4中任一项所述的数据动态效果的实现方法。

技术总结
本申请提供一种数据动态效果的实现方法、装置、电子设备及存储介质，涉及计算机技术领域，以解决相关技术中在前端页面中需要手动开发对应的功能组件，导致生成前端页面的效率比较低的问题。该方法包括：响应于用户在前端数据开发页面的目标VUE插件安装操作，安装目标VUE插件，并在前端数据开发页面激活目标VUE插件对应的数据动态效果组件库；数据动态效果组件库包括多个动态效果功能组件；一个动态效果功能组件对应一个动态效果参数；响应于用户在目标VUE插件中输入的动态效果指令，确定动态效果指令的输入参数；确定与输入参数相同的目标动态效果参数，并显示目标动态效果参数对应的目标动态效果。

技术研发人员：黄兆如
受保护的技术使用者：中国联合网络通信集团有限公司
技术研发日：
技术公布日：2024/3/21