微信小程序开发入门

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

 

首先安装工具

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

1.双击进行安装。

2.创建项目

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


没有appid选择无appid

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


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

扫描二维码关注公众号,回复: 317102 查看本文章



 右面是自动生成的项目代码结构。

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

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

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

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

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



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

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

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

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

<!--logs.wxml-->
<view class="container">
   <input placeholder="请输入快递单号" bindinput="input" />
   <button type="primary" bindtap="btnClick"> 查询 </button> 
</view>
input{
  border:1px solid #1AAD19; 
  width:90%; 
  height:20px; 
  font-size:12px; 
  padding:5px 10px;
  }
 button{
   margin-top:20px;
   }

猜你喜欢

转载自1175644344.iteye.com/blog/2357045
今日推荐