Question

我的Nativscript Vue应用程序中有一个WebView，但是在Android上，嵌入式网站无法访问浏览器中的localStorage。 This question解释了如何为Angular做到这一点。问题在于不清楚应该从何处获取webview实例。完整性问题：如何访问包含android属性的WebView实例以在其上启用本地存储？

Answer 1

只需将Vuex与该插件nativescript-localstorage结合使用。我说它未经Nativescript 6的测试。我可以说它有效是因为我自己使用了它。

nil

的示例

store.js

您的import Vue from 'vue'; import Vuex from 'vuex'; import localStorage from 'nativescript-localstorage'; const NSVuexPersistent = store => { let storageStr = localStorage.getItem('ns-vuex-persistent'); if (storageStr) { store.replaceState(JSON.parse(storageStr)) } store.subscribe((mutation, state) => { // Suscribe hook. localStorage.setItem('ns-vuex-persistent', JSON.stringify(state)); }) }; Vue.use(Vuex); export default new Vuex.Store({ state: { nations: null }, plugins: [NSVuexPersistent], mutations: { updateNations(state, nations) { state.nations= nations; } } });的外观如何（添加此内容）：

main.js

Answer 2

这就是我最终解决它的方式。我需要访问在属性event.object中通过事件处理程序传递的WebView。组件上没有名为onWebViewLoaded的事件，因为它不是Angular。相反，我们需要挂钩loadFinished元素上的WebView事件。

<template>
  <Page>
    <WebView
      src="https://www.example.com/"
      @loaded="onLoaded"
    />
  </Page>
</template>

<script>
export default {
  methods: {
    //when the webview finishes loading
    onLoaded(event) {
      //get the webview
      const webView = event.object

      //if there is android
      if (webView.android) {
        //enable dom storage in the webview on android
        webView.android.getSettings().setDomStorageEnabled(true)
      }
    }
  }
}
</script>

如何在Nativescript Vue WebView中启用LocalStorage？

2 个答案: