• 个人技术总结——使用element ui组件库的前端开发


    技术概述

    这个技术是做什么的?

    • Element UI一套为开发者、设计师和产品经理准备的基于Vue 2.0的桌面端组件库

    学习该技术的原因

    • 在项目beta冲刺阶段开发管理员前端需要

    技术的难点在哪里

    • 组件分类以及元素属性繁多复杂,并且相关资料较少,有时候遇到问题要花很多时间解决

    技术详述

    你是如何实现和使用该技术的

    • 通览一遍官网,了解该工具的大致信息

    1

    • 通过教程学习基本的安装、环境搭建以及各组件的使用

    2

    3

    • 学习教程视频中的实战训练

    4

    • 自己动手开发

    5

    问题和解决

    • 当使用表格组件且表头的内容过长时,过多的字显得非常不美观
    • 解决方法:为相应的表头元素加入show-overflow-tooltip属性,并且一定要规定width属性的大小,过长的内容就会被隐藏显示为省略号

    6

    • 分页组件不能正确分页
    • 解决方法:定义一个方法,当换页时会回调这个方法返回新的页码,利用新的页码向服务端请求该页数据即可实现分页。

    7

    8

    • 点击按钮组件后不能及时刷新数据
    • 解决方法:在按钮组件所触发的点击事件方法中加入向服务端请求数据的方法

    9

    10

    总结

    对于后端开发人员来说,element ui确实是一个前端开发非常容易上手而且实用的工具。正所谓活到老学到老,学习新知识、接触新技术都是我们现阶段需要做的事。当然学习的过程一定不是一帆风顺,就比如我使用的时候大大小小的问题碰到一堆,但是我们一定要先自己动手去排查错误,找出问题所在,要利用好网络资源,前辈们的博客文档都是精华。自己亲自解决错误更能加深相关问题的印象。使用vue框架加上element ui组件库能大大提高开发效率,而且通过修改主题样式也可以形成自己的风格,总之是一个非常棒的工具。

    参考文献、参考博客

    • element ui使用教程视频

        标题:适合后端编程人员的 ElementUI教程,结合SpringBoot项目案例,已完结!!!
        作者:编程不良人
        链接:https://www.bilibili.com/video/BV1NK4y187XH?p=20
      
    • 正确实现分页

        标题:使用el
        作者:未知
        链接:https://www.dazhuanlan.com/2019/12/05/5de8af700306e/
  • 相关阅读:
    axis2 WebService的发布与调用
    Lucene、Compass学习以及与SSH的整合
    qsort函数应用大全
    Effective C++ ——模板和泛型编程
    Effective C++ ——继承与面向对象设计
    Effective C++ ——实现
    Effective C++ ——设计与声明
    Effective C++ ——资源管理
    Effective C++ ——构造/析构/赋值运算符
    Effective C++ ——让自己习惯C++
  • 原文地址:https://www.cnblogs.com/wyyhandsome/p/13126592.html
Copyright © 2020-2023  润新知