微信小程序 —— helloword

在微信公众号里用微信注册认证一个小程序，然后根据提示下载开发工具：
本篇文章介绍编码目录及一个完整的helloword 案例：
基本目录结构和效果图如图：

我们不使用模板生成一个项目，项目里只有project.config.json文件，这个文件是帮助我们配置项目的信息，实现一些个性化配置 ，图中有关app字样，helloword字样，pages目录。index子目录都是自己创建的，关于一个项目的都默认样式差不多就是这样了，
分析各各文件及目录的作用：

• app.js文件是脚本文件处理一些公共的或者全局的逻辑。比如在这里定义全局变量处理登录逻辑指定首页等。
• app.json文件是小程序的整体配置文件。我们必须要在这个文件中配置小程序是由哪些页面组成的，我们还可以在这个文件中配置整个小程序的统一的窗口 背景色，导航条 样式，默认标题。
• app.wxss文件是整个小程序的公共样式表。我们可以在小程序子页面组件的 class 属性上直接使用 app.wxss 中声明的样式规则。也就是说在这个文件里定义的样式在其他任何的子页面中都可以使用。这个也是为了代码的简洁和整体风格的统一

---

• helloword.js文件是帮助我们去注册一个微信小程序的页面，它类似于app.js，通过一个配置函数去帮我们注册的，要去传入一个参数，参数也是object类型，我们可以在这个参数传入我们一些页面的生命周期钩子和数据处理函数，以及我们页面的一些默认数据等等
• helloword.json文件是我们HelloWord页面的一些配置，这里至少要传入一个空的配置对象
• helloword.wxss: 描述我们小程序的一个样式
• helloword.wxml: 是编辑一个页面的布局 （这里可以理解成编辑一个HTML页面）
  pages 看这个名字就知道是干嘛的了吧！
  来看看我们的代码吧：

app.js: 文件为空。
app.json (言简视图) :

{
  "pages":[
  "pages/index/helloword"
  ]
}

app.wxss (统一全局样式的文件)：

view {
  font-family: "宋体"
}

helloword.js(生命周期钩子和数据处理函数):

Page({
  data: {
    hello: "hello word"
  }
})

helloword.json:

{
  "usingComponents": {}
}

helloword.wxml(视图):

<view 
class="hello">{{hello}}
</view>

helloword.wxss(当前子目录的样式设置):

view {
  width: 100%;
  height: 40rpx;
  text-align: center;
}
.hello{
  font-size: 30px;
}

到这里一个简单的helloword就完成了，本文章为初入-欢迎讨论 ！