微信小程序的小技巧

看到项目中有的文件代码实在是过长，想起之前看的视频教程，里面有很多值得我们借鉴的地方。

欢迎大家提出宝贵的意见。

代码结构

代码结构

commponents组件目录。 images：放图片的里面最好以各模块来再划分一下文件夹。models专门处理数据的，后面会说。pages页面内容。util：常用的数据处理 。还有个重要的 config.js ,这个专门放配置信息的，在Java项目中会经常看到这个。比如后台接口地址，百度ApiKey, 等等。另外关于文件、文件夹的命名最好一个项目中做到统一，不要同时出现驼峰，下划线，- 进行分割。 还是比较建议使用‘-’的。

commponents组件目录： 很多人可能会觉得组件就是为了复用的，所以只封装了一些很常用的组件，但是在微信文档里面有句话很到位

开发者可以将页面内的功能模块抽象成自定义组件，以便在不同的页面中重复使用；也可以将复杂的页面拆分成多个低耦合的模块，有助于代码维护。自定义组件在使用时与基础组件非常相似。

对，就是解耦合，代码也进行分离。一个pages如果功能稍微多一点，wxml代码会很长，对应的js会更长！ 拆分后，代码思路会更清晰，改bug加功能，也会更简单明了写。 比如详情页。可以拆分为这么几个， 1234可以服用，5好好规划下也是可以复用的。最关键的是这么多功能如果不拆分，都搞到wxml,js中，也挺不爽的。

【图片图片过不了审核。】

2、models这个里面包含有各个大模块的数据请求，数据逻辑处理的函数方法。之所以搞这个就是为了拆分js。比如上面的功能，如果合在一起写，js里面的代码将会达到2000行，太长了，阅读不便。目前复杂点的页面对应的js代码都上千行，看代码找bug，太麻烦了。

建议：将数据请求，处理都拆分到数据处理模块。如：新增model文件夹，根据各个大的模块新增js文件，如二手房second-house.js. 创建类

models中的second-house.js

页面中使用models中的js中的类的方法

这样，方法就可以单独抽取来。页面的js中对于这些接口请求代码，就少了很多，更关注于页面的响应，代码更简洁。 另外将请求方法单独抽取来，方法也能做到复用，尽量避免在页面的js中写接口请求的代码。

4、如果是一个类型的功能方法，尽量封装在一个类中，比如处理数字的，处理字符串的，最好也封装为一个class，如number-handles.js 封装为类后导出，导入就不用导出每个方法了，写一大串，直接导出类，直接通过类来调用方法。 

5、内部使用的属性，方法前面加上_, 对外使用的不用加。 

6、对于表单填写页面，加上双向绑定，能省很多代码！！！