第一次项目前端开发总结

第一次项目前端使用uniapp开发,但是因为个人技术能力问题,在开发过程中遇到了很多的问题,下边总结一下。

代码结构

uniapp是基于vue的一个前端框架,所以使用起来和vue查的不太多,但总体来讲要比vue方便很多。
首先页面跳转的时候需要在pages.json文件中注册组件路由地址,才可以在<navigator></navigator>标签中指向相应的页面。
单个页面结构中,html部分代码是由一个<template></template>标签包裹的,但一定要注意的是在<template></template>中的代码必须由一个<view></view>标签包裹。
js部分可以通过import引入组件,然后通过export default定义组件并暴露组件。js中结构一般为先写data(){},再写生命周期函数,再写methods:{}。
css部分在style中尽量声明一个scoped保证每个文件中css文件不冲突,也可以设置lang="scss"来定义scss格式的css样式。
公用的组件可以创建一个文件夹单独盛装各个组件,js配置文件可以创建一个utils文件夹。
App.vue和main.js文件可以定义一些全局api和全局参数。

组件

组件在前端属于一种特别重要的东西,但是组件是不能乱写的,各种传参各种方法调用是不能够称为很好的组件的,打个比方说,一个好的组件应该算是一个带有很多插口的盒子,拼接积木的时候,哪里用到这个盒子,就直接把这个盒子拿过来,需要这个盒子实现什么功能,就接入哪个插口。前端的代码也需要实现可扩展低耦合,所以一个组件应该单独存在,不对外依赖,而应该让其他地方去依赖这个组件,应该对外暴露组件内部的“开关”,需要开启什么功能直接调相应的功能开关,而不应该向组件中传递一些变量参数。

学习

接触一个新的技术,最快的学习方法就是读官方文档,官方的API,不过有时候在进行学习的时候可能会出现读了官方文档也不会使用的情况,这种情况很大的可能就是平时接触这一类的知识比较少,应该在平时多去练习多去吸收阅读官方文档的经验。

基础

在写这个项目的过程中,遇到了很多问题其实都是基础上边的问题,数据类型的定义、数据类型的改变、代码书写规范、代码条件判断等,这些基础问题在平时留意的比较少,因为总觉得这些基础很简单不重要,但是在项目中处处都可以体现基础的使用,这反而是编写代码中更重要的部分,所以在平时书写代码的时候就应该养成良好的代码习惯,并掌握好相应的基础知识。

代码

在书写一个vue文件的时候,相应的方法应该全部放在method:{}里边,然后通过生命周期钩子函数去调用这些方法或者通过其他方法来调用这些方法。尽量减少data(){}中参数的数量,尽量减少父子组件之间的传参,尽量减少一个组件对外的依赖。

猜你喜欢

转载自blog.csdn.net/weixin_42880088/article/details/107445376