uni-app は現在の環境情報を取得します
uniapp シェルを使用して、Vue によって開発された Web ページ プロジェクト リンクをネストします. この Vue プロジェクトでは、現在の環境が APP であるか WeChat アプレットであるかを取得し、異なる環境で排他的な操作を実行し、参照します依存ファイル
.
web-view で読み込まれた HTML で uni の API を呼び出すには、HTML で必要な JS-SDK を参照する必要があります。
<!-- 微信 JS-SDK 如果不需要兼容小程序,可以不引用 JS 文件。 两个文件同时引入时,微信的需要在前-->
<script type="text/javascript" src="//res.wx.qq.com/open/js/jweixin-1.4.0.js"></script>
<!-- uni 的 SDK,必须引用。 -->
<script type="text/javascript" src="//js.cdn.aliyun.dcloud.net.cn/dev/uni-app/uni.webview.0.1.52.js"></script>
使用
HTML は、さまざまな状況でさまざまなアクションを実行したり、さまざまなメッセージを配信したりする必要がある場合があります。uni.getEnv() メソッドを使用して、現在の環境情報を取得できます
1. public/index.html に JS-SDK を導入します
2. Vuex を使用して、他のページを準備します: store/index.js
import Vue from 'vue'
import Vuex from 'vuex'
Vue.use(Vuex)
export default new Vuex.Store({
state: {
isApp: false
},
mutations: {
setIsApp(state, data) {
state.isApp = data
}
},
actions: {
},
modules: {
},
getters: {
}
})
3.APP.vueでの使用
import {
mapState} from "vuex";
computed: {
...mapState(["isApp"]),
},
mounted() {
setTimeout(() =>{
this.getEnv()
});
},
created() {
document.addEventListener('UniAppJSBridgeReady', () =>{
this.getEnv()
});
},
methods: {
getEnv() {
if(uni.getEnv) {
uni.getEnv((res) =>{
this.$store.commit('setIsApp',res.plus || false)
});
}
}
アプレットを実行して効果を確認します