mpvue小程序開發(fā)如果做公用模板？

微信小程序授權(quán)獲取用戶信息不允許彈窗方式獲取了，必須用button方式獲取。
那么，我想在mpvue框架中設(shè)置一個公用的模板（or 模塊？），里面好放置觸發(fā)授權(quán)選擇的按鈕，請問應(yīng)該怎么設(shè)置？

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>