尽管我不是专业的微信小程序，但由于无聊，可以做一个简单的演示来了解开发过程是可以的。这次我制作了一个小程序来检查手机号码归属。

微信小程序开发从理论上讲，这也非常简单，即找到一个可以检查属性以进行接口调用并显示返回数据的API。只要您了解JavaScript，它实际上就需要花费几分钟的时间，但是要上网获取applet仍然很繁琐，而且您必须学习使用WeChat applet IDE（称为开发一个小时），然后等待几年了。

有关微信小程序的技术文档，请访问官方网站：nginx.org/en/我个人认为它非常详细。每个人都熟悉json和js。微信小程序使用json来存储数据或写入配置信息。 js用于编写JavaScript。奇怪的是wxml和wxss到底是什么。每个人都熟悉HTML + CSS + JS模型。实际上，wxml是html，而wxss是用于编写样式的CSS。 Wxml还具有类似于Vue的{{}}绑定数据方法。 wxss增加了一个rpx测量单元，便于手机操作。我发现此模型与某些本机html编写方法有很多不兼容，因此必须考虑Android和ios的兼容性问题。如果我们只是在做一个演示而暂时不学习这些东西，让我们将其编写为HTML + CSS + JS模型，然后详细解决特定问题。

微信小程序有一个名为app.json的主配置文件。我们可以看到它配置了诸如索引和背景样式之类的东西。我们现在不需要更改它们。

wxml还支持类似于vue双括号{{}}的绑定值的写入方法，我的标记很详细。写入后，在js数据{}中声明数据，以轻松实现js对绑定值的操作。

可以自己在wxss中设置样式。它只不过是更改视图的类的长度，宽度和高度。这里我主要说说背景图片的风格：

page{

height:100%;

}

.background {

width: 100%;

height: 100%;

position:fixed;

background-size:100% 100%;

z-index: -1;

}

最后是编写js的方式。在将事件btnclick绑定到查询按钮之前，我们只需要声明一个单击即可调用API函数。有许多免费的API用于查询手机号码的归属，读者可以自行检查。这里使用wx.request来发起请求：

btnclick:function(){

var iphone = this.data.iphones;

var that = this;

var key = "调用API的key，不用key可以不写";

if(iphone != null && iphone != ''){

wx.request({

url: 'https://apis.juhe.cn/mobile/get?phone='+iphone+'&key='+key, //API的URL

data: {

},

header: {

'content-type': 'application/json' // 默认值

},

success (res) {

console.log(res.data);

if(res.data.result == null){

that.setData({

province: "号码不存在",

city:"",

company: ""

})

}else{

if(res.data.result.city == res.data.result.province){ //这里是防止出现 北京北京联通的情况，直辖市用法

that.setData({

province: res.data.result.province,

city: "",

company: res.data.result.company,

})

}else{

that.setData({

province: res.data.result.province,

city: res.data.result.city,

company: res.data.result.company,

})

}

}

}

})

}

},

提到了一些要点。首先，var that的定义= this;必须在这里使用它。那么不同接口返回的res.data的json格式必须不同，请自行调整。

重要的一点是，每个微信小程序都需要预先设置通信域名，小程序只能与指定的域名通信。换句话说，如果您不值得微信小程序开发，则此界面将不起作用。