IT数码 购物 网址 头条 软件 日历 阅读 图书馆
TxT小说阅读器
↓语音阅读,小说下载,古典文学↓
图片批量下载器
↓批量下载图片,美女图库↓
图片自动播放器
↓图片自动播放器↓
一键清除垃圾
↓轻轻一点,清除系统垃圾↓
开发: C++知识库 Java知识库 JavaScript Python PHP知识库 人工智能 区块链 大数据 移动开发 嵌入式 开发工具 数据结构与算法 开发测试 游戏开发 网络协议 系统运维
教程: HTML教程 CSS教程 JavaScript教程 Go语言教程 JQuery教程 VUE教程 VUE3教程 Bootstrap教程 SQL数据库教程 C语言教程 C++教程 Java教程 Python教程 Python3教程 C#教程
数码: 电脑 笔记本 显卡 显示器 固态硬盘 硬盘 耳机 手机 iphone vivo oppo 小米 华为 单反 装机 图拉丁
 
   -> JavaScript知识库 -> 实习生活2 -> 正文阅读

[JavaScript知识库]实习生活2

今天又是周末,又来根据自己的记忆记录一下前面的实习生活吧。

组件化

刚到公司的前面几天,我都是在学习公司的代码。我刚看到代码印象最深刻的就是:这组件化好彻底呀。他分有三种类型的组件:1.全局通用自己封装的组件,放置在src目录下。2.全局通用二次封装的组件,放置在src目录下。3.个别页面的通用组件,放置在改页面下的component中。

为什么会觉得组件化对我印象深刻呢。主要是因为自己在学校只有组件化,但是并没有太多的去使用,在课程设计上和同学一起完成的项目里面,有效果一样的东西,就是prop传入的值不同,如果当时也具有这种组件化那么彻底的想法,小组的成员就不需要写很多重复的东西。但是当时我们完全相当于自己写了很多类时的页面了。

在实习中,我们的UI设计图中,需要一样的展示界面,展示数据都一样,不一样的就是子元素的宽度和父元素的边距。在首页需要这个样式的宽度是有边距的,而在具体的页面中,这个展示是铺满整个宽度的。如果还是在学校的思想,我肯定会写两次。但是现在学习企业级的代码,我就会去用组件去解决,写一个公用的组件,prop传入宽度,边距这些不一样的值即可,此时,在首页和具体的展示页面就是两个样式,但是由于自己相对于学校提升的组件化思想,少写了很多重复性的代码。

全局样式

刚看代码的时候,还有很多的.scss文件,但是我刚开始并没有很重视这些文件,我觉得这就是一样样式文件,但是后面也认识到了全局样式的重要性。

刚开始我的任务就是修改一些版本迭代需要更改的样式,然后涉及到一些颜色问题,因为我的不重视,我就去figma中查找16进制颜色代码,我就直接用了这个16进制代码,后面提交代码的时候,导师就过来查看,他就和我说,你知不知道scss的是干啥的。我说知道,是定义一些全局通用样式的可以使用变量去定义样式,还可以进行选择器的迭代。然后导师又说那你这个颜色你这么写死,以后万一要改变不是要一个一个改,你看一下我们在.scss文件里面是不是定义了颜色的样式这样后面我们修改就很方便。然后导师又指导了一些知识。然后我把.scss文件看了一次,发现不知定义了颜色,字体这些,还有一些常用的布局比如flex的水平垂直居中,排列方向是交叉轴等等,定位有相对,绝对,固定等等。这样就更方便了,只需要在class中写上这个定义好的布局名字,用到的样式也不用每次都写上各种属性,更有利于开发了。

经过导师的指导,确实是我在学校里面虽然学习一些知识,也练习过一些demo,但是我确实还是太懂得去运用,所以实习是很重要的,更让人把学到的知识更好的运用。

样式问题

刚开始上手代码时候,就是让我修改一些样bug,还有一些新的迭代版本样式。
印象深刻一个是,在电脑端小程序开发者工具运行出来是正常的,不过测试他们测试的时候,他们发现了在手机端那个按钮是不居中的,然后我导师把修改的任务交给我了。刚开始我是没有头绪的,因为我也觉得奇怪,小程序开发者工具运行是居中的,在手机测试显示不正常,看了代码之后,他们之前写使用了定位去定位这个按钮。不过头像框和这个按钮都是以最外层的view的相对定位去定位的。我觉得应该是这样计算定位不太准确,然后我在头像框里面嵌套了一个view,这个view也会填满整个头像框,我把这个新的view作为按钮的定位点再去计算,这样能保证这个按钮始终在头像框正中间。
另一个是,结算时候的按钮,有三行金额,第二行为0时,结算的明目不对齐,他是把明目和金额放在一个view里面了。我把明目和金额分开就行,我也想了一下如果以前在学校我肯定会用浮动布局来弄成以右边展示,但是经过我前面的学习代码,发展基本都没有使用到浮动布局。使用了flex然后设置交叉轴方向就可以让他右边展示。越来越觉得flex永远的神,怪不得基本面试官都会提问flex布局的知识点。

对象的设置

测试检查出来,有一个界面外面是有这些信息的展示的,但是点击进去的时候,有某几个物品的具体信息没显示出来,我就开始检查,找到对应的组件,找到prop值,发展并没有在方法区找到这个请求后台数据的方法,也没看到vuex的使用,但是我看到了mixin,果然不出我所料,他把请求放在了mixin里面,然后,我打印请求的数据,得到的对象确实不是完全的

  JavaScript知识库 最新文章
ES6的相关知识点
react 函数式组件 & react其他一些总结
Vue基础超详细
前端JS也可以连点成线(Vue中运用 AntVG6)
Vue事件处理的基本使用
Vue后台项目的记录 (一)
前后端分离vue跨域,devServer配置proxy代理
TypeScript
初识vuex
vue项目安装包指令收集
上一篇文章      下一篇文章      查看所有文章
加:2021-12-13 12:43:13  更:2021-12-13 12:44:51 
 
开发: C++知识库 Java知识库 JavaScript Python PHP知识库 人工智能 区块链 大数据 移动开发 嵌入式 开发工具 数据结构与算法 开发测试 游戏开发 网络协议 系统运维
教程: HTML教程 CSS教程 JavaScript教程 Go语言教程 JQuery教程 VUE教程 VUE3教程 Bootstrap教程 SQL数据库教程 C语言教程 C++教程 Java教程 Python教程 Python3教程 C#教程
数码: 电脑 笔记本 显卡 显示器 固态硬盘 硬盘 耳机 手机 iphone vivo oppo 小米 华为 单反 装机 图拉丁

360图书馆 购物 三丰科技 阅读网 日历 万年历 2024年11日历 -2024/11/24 9:51:51-

图片自动播放器
↓图片自动播放器↓
TxT小说阅读器
↓语音阅读,小说下载,古典文学↓
一键清除垃圾
↓轻轻一点,清除系统垃圾↓
图片批量下载器
↓批量下载图片,美女图库↓
  网站联系: qq:121756557 email:121756557@qq.com  IT数码