クロスドメイン処理vuebase-11._

1.クロスドメイン構成

proxyTable：{
'/ xxx_api'：{
ターゲット： 'のhttp：// xxxcom'、
pathRewrite：{
'^ / xxx_api'： ''
}、
changeOrigin：真
}
}

mains.js

Vue.prototype.HOST = "/ xxx_api"
Vue.config.productionTip =偽

例------------------------------------------------- ------------------------------

<テンプレートLANG = "HTML">
<DIV CLASS = "こんにちは">
HelloWorldの！
</ DIV>
</テンプレート>

<スクリプト>
輸出デフォルト{
名： 'HelloWorldの'、
データ（）{
リターン{
MSG： 'ようこそあなたVue.jsのアプリに'
}
}、
{（）マウント
。/ *この$のaxios.get（ "XXXX"）。
次いで、（RES => {
にconsole.log（res.data）
。}）キャッチ（エラー=> {
にconsole.log（エラー）;
}）* /
/ *この$のaxios.post（ "XXX"、{
uers_id。 "12345"、
パスワード： "1234567890"
。}）、次いで（RES => {
にconsole.log（res.data）
。}）キャッチ（エラー=> {
にconsole.log（エラー）
}）* /
/ * axios（{
方法： 'ポスト'、
URL： '/ユーザー/ 12345'、
データ：{
のfirstName：「フレッド、
lastNameの： 'フリントストーン'
}
}）* /
VAR URL = this.HOST + "/ V2 / XXX / top250"
この$ axios（{。
メソッド： '取得'、
URL：URL
。}）、その後（RES => {
はconsole.log（res.data ）
}）。キャッチ（エラー=> {
にconsole.log（エラー）
}）
}
}
</ SCRIPT>

<！ -追加「スコープ」このコンポーネントのみにCSSを制限する属性- >
<スタイルスコープ>
H1、
H2 {
フォント重量：ノーマル;
}

UL {
リストスタイル型：なし。
パディング：0;
}

李{
表示：インラインブロック。
マージン：0 10pxの;
}

{
色：＃42b983。
}
</スタイル>