Wepy概述

wepy是微信小程序的一个原生的框架，与Vue.js类似。其文件架构包括：

• pages: 保存使用到的页面，如项目中的主页面，任务发布页面等
• components: 存放一下结构比较复杂的，或者每个页面都存在的公共组件，如底部的导航栏
• app.wpy: 入口文件

• sotre: redux(如果你创建项目时使用了redux的话）

• wepy.config.js: webpack配置文件

• project.config.json: 小程序项目配置文件

• index.template.html: web页面的入口文件

由于我主要负责项目的UI设计和一些前段样式的修改，所以主要针对pages和component中的文件进行分析。wepy的页面以及组件的文件格式都为.wpy格式，其文件内部的框架如下：

• template——是文件的页面模块，即wxml部分，但要求template标签内只能存在一个的框架，所以在进行页面的开发是，需要用一组的标签将整个页面的不同部分包起来
• script——是页面数据以及实现响应的过程模块，需要注意的是微信小程序开发工具对于这一块的格式要求是非常严格的，特别是分号，逗号之类的使用。
• style——即页面样式，大部分情况下我们都直接使用微信默认的样式，可以直接引入微信小程序默认的样式文件，如果需要修改，则只需要在文件里面重新定义属性的值即可

遇到的问题

• 在数据驱动的页面中data修改与显示的问题
  • 对于在页面中用到的任何数据，都应该事先在data中定义并且赋值，否则没有赋值的数据元素是没有办法在后期修改的。
  • this.data.ele会改变页面里该数据副本的值，但由于页面不刷新显示，所以并不能改变页面的数据
  • this.setData()再修改数据后确实会更新页面，这在修改数据为一个数组是并不会出先问题，但是当我们需要更新的是一个单纯的value值时，由于会出现先刷新出所给的值，再刷回原来值的情况。
  • this.ele是直接改变页面的值，也可以刷新页面。虽然不建议这样做，但当你遇到上面两种方式都无法解决问题的时候，可以使用这种方式直接进行赋值
• 开发中this的指代问题
  • 在同步的问题中，this表示当前的调用者对象，通常来说是不会出现错误的
  • 但是在异步问题中通常不建议直接使用this，因为在异步过程中this很容易产生歧义
• navigateTo()和redirectTo()的区别
  • navigateTo()保留当前页面，跳转到应用内的某个页面
  • redirectTo()关闭当前页面，跳转到应用内的某个页面
• 在页面中无法多次引入同一个组件
  • 组件使用的是静态编译组件，即组件是在编译阶段编译进页面的，每个组件都是唯一的一个实例。 多个组件共享同一个数据。并且静态编译组件
  • 由于组件类似于模版，所以在页面中如果不指定不同的id，多次引入同一个组件时就会报错，所以如果一个组件要用多次的话，就需要分别定义。
• 在每次输入结束需要清空input时
  • 在有些情况下，this.inputValue = ''是无效的，必须要用setdata才可以
• 组件样式调整又是没有办法显示
  • 可能是因为调整了该组件没有的属性
  • 也可能是一个组件中引入另一个组件作为字组件，因为父组件没有<style>标签，导致子组件不编译<style>标签的内容