微信小程序开发入门

微信小程序有自己的开发工具,微信web开发者工具

 

首先安装工具

官方工具:https://mp.weixin.qq.com/debug/wxadoc/dev/devtools/download.html

1.双击进行安装。

2.创建项目

 手机扫二维码登陆-选择小程序-添加项目


微信小程序开发入门_第1张图片

没有appid选择无appid

项目目录新建一个文件夹,在创建 quick start 项目前打钩。如果文件夹不是空的会出现读取json文件错误,如下图


如果是打开小程序demo,则直接选择就可以,不需要新建文件夹。
 
 操作正确出现的页面


微信小程序开发入门_第2张图片
 右面是自动生成的项目代码结构。

app.js是小程序的脚本代码,是必须的;

app.json是整个小程序的全局配置,是必需的;

app.wxss是整个小程序的公共样式表,相当于CSS;

app.wxml是页面结构文件,相当于Html。

做了一个查询快递的页面(没有接口地址,所以并不能查询)


微信小程序开发入门_第3张图片
 编辑代码后需要按Ctrl+S键才可以看到效果。

编辑代码后需要按Ctrl+S键才可以看到效果。

编辑代码后需要按Ctrl+S键才可以看到效果。

以下是快递查询页面的代码



   
    

 

input{
  border:1px solid #1AAD19; 
  width:90%; 
  height:20px; 
  font-size:12px; 
  padding:5px 10px;
  }
 button{
   margin-top:20px;
   }

 

你可能感兴趣的:(微信web,json,开发工具)