vscode开发微信小程序插件-微信小程序用什么开发

在本地搭建好后台环境后，我们来实现登录功能

1.安装SDK插件

SDK插件用于获取用户的openId

SDK是服务端（即后端）的一个插件，可以帮助我们轻松获取openId。 openId是微信中用户身份的唯一标识。 我们使用openId来标识用户，方便后期的用户管理

~/WeChatProjects/truth_hold$ npm install --save wafer2-client-sdk

//系统返回信息
+ wafer2-client-sdk@2.1.0
added 1 package from 1 contributor and audited 10626 packages in 10.382s
> wafer2-client-sdk应用文档
https://github.com/tencentyun/wafer2-client-sdk

2.增加授权登录按钮

编辑src/pages/index/index.vue文件的模板部分，添加授权登录按钮

登录按钮是小程序和小程序集成的一个API，登录按钮规定的写法

    授权登录

3.配置登录链接

编辑src/config.js文件，config.js文件是用来放配置代码的，把原来的代码替换成下面的代码

为什么登录链接是 ：5757/weapp/login ，后面的课程会详细分析

//域名，通过域名来找到服务器，在这里我们将本地电脑当成服务器
//所以现在配置的域名是本地的，当项目实际上线，这里需要换成已备案的域名
const host = 'http://localhost:5757'

const config = {
  host,
  loginUrl: `${host}/weapp/login`
}

//我们在【ES6知识点详解】中讲过export的意思是向外暴露接口
//这样在其他文件中可以通过import config from '@/config'引用
//然后通过config.loginUrl就能得到在本文件中配置的值'http://localhost:5757/weapp/login'
export default config

4.删除测试代码

在第2章学习ES6的时候，我们在index.vue界面添加了一些代码，现在删除这些测试代码，删除后

5.引用配置文件

在 src/pages/index/index.vue 文件中添加导入引用 SDK 插件和 config.js 文件

//参考代码，无需粘贴
//