mpvue小程序开发如果做公用模板？

Question

微信小程序授权获取用户信息不允许弹窗方式获取了，必须用button方式获取。
那么，我想在mpvue框架中设置一个公用的模板（or 模块？），里面好放置触发授权选择的按钮，请问应该怎么设置？

main.js

import Vue from 'vue'
import App from './App'

Vue.config.productionTip = false

const app = new Vue(App)
app.$mount()

export default {
  config: {
    pages: ['^pages/me/main'],
    'window': {
      'backgroundTextStyle': 'light',
      'navigationBarBackgroundColor': '#EA5149',
      'navigationBarTitleText': '恶狼图书',
      'navigationBarTextStyle': 'light'
    },
    'tabBar': {
      selectColor: '#EA5149',
      list: [
        {
          pagePath: 'pages/books/main',
          text: '图书',
          iconPath: 'static/img/book.png',
          selectedIconPath: 'static/img/book-active.png'
        },
        {
          pagePath: 'pages/comments/main',
          text: '评论',
          iconPath: 'static/img/todo.png',
          selectedIconPath: 'static/img/todo-active.png'
        },
        {
          pagePath: 'pages/me/main',
          text: '我',
          iconPath: 'static/img/me.png',
          selectedIconPath: 'static/img/me-active.png'
        }
      ]
    }
  }
}

App.vue

<script>
import {get, showSuccess} from './util'
import qcloud from 'wafer2-client-sdk'
import config from './config'

export default {

  async created () {
    const res = await get('/weapp/demo')
    console.log(123, res)
    console.log('小程序启动了')
  }
}
</script>

<style>
.btn{
  color:#FFF;
  background:#EA5A49;
  margin-bottom: 10px;
  padding:0 15px;
  border-radius: 2px;
  font-size:16px;
  line-height: 40px;
  height: 40px;
  width: 100%;
}

.btn:active{
  background:#A05049;
}
</style>

Answer 1

将你需要的按钮组件引入到你需要的组件当中