vue微信扫码登录实现

最简单的方式用vue-wxlogin

1.安装依赖

npm install vue-wxlogin --save-dev

2.在需要的页面引入微信登录的组件

import wxlogin from 'vue-wxlogin';

components: {
    wxlogin
},

3.在页面上使用

<wxlogin
    href="data:text/css;base64,..." //自定义样式链接，转成base64
    id="wxcode"
    theme=""
    :state="state"    //你们自己后台需要的参数
    :appid="appids"    //应用唯一标识，在微信开放平台提交应用审核通过后获得
    scope="snsapi_login"    //写死这个即可      
    :redirect_uri="encodeURIComponent(redirect_uri)"    //重定向地址，需要进行UrlEncode
></wxlogin>

4.生成的效果