从参数创建 URL 并设置 Vue.js Vuex 状态
Creating a URL & setting Vue.js Vuex state from its parameters
我在 Vue.js 中内置了一个 SPA，它允许用户输入多个值来创建类似菜谱的内容。所有这些值都存储在 Vuex 状态中。我希望能够使用用户输入的状态值创建一个 URL，以便其他用户可以使用已输入的这些值加载应用程序。本质上，我想让用户通过分享 URL.
来分享他们在我的应用中创建的食谱
我在想象一个 "share" 按钮，它将创建的 URL 复制到用户的剪贴板，然后他们可以在社交媒体或其他任何地方 post。然后当有人访问 link 时，他们会转到我的应用程序，vuex 状态值将自动更新为 URL.
中找到的参数值
实现此功能的最佳方法是什么？ vue-router 可以做到这一点吗？
如果我理解正确的话，vue-router 应该就是这样做的。
查看他们发送用户 ID 的文档。您可以传递任意数量的参数。
https://router.vuejs.org/en/essentials/dynamic-matching.html
注意：您可以考虑使用路由器重建应用程序路径。
使用 vue-router 提供的 $route.query 属性。
通过您的 URL 传递参数，例如 http://example.com/#/?amount=10 并使用 this.$route.query.amount 访问它们。
在主要组件的 mounted() 方法中更新您的 vuex 商店。
我在 Vue.js 中内置了一个 SPA，它允许用户输入多个值来创建类似菜谱的内容。所有这些值都存储在 Vuex 状态中。我希望能够使用用户输入的状态值创建一个 URL，以便其他用户可以使用已输入的这些值加载应用程序。本质上，我想让用户通过分享 URL.
来分享他们在我的应用中创建的食谱我在想象一个 "share" 按钮，它将创建的 URL 复制到用户的剪贴板，然后他们可以在社交媒体或其他任何地方 post。然后当有人访问 link 时，他们会转到我的应用程序，vuex 状态值将自动更新为 URL.
中找到的参数值实现此功能的最佳方法是什么？ vue-router 可以做到这一点吗？
如果我理解正确的话，vue-router 应该就是这样做的。
查看他们发送用户 ID 的文档。您可以传递任意数量的参数。
https://router.vuejs.org/en/essentials/dynamic-matching.html
注意：您可以考虑使用路由器重建应用程序路径。
使用 vue-router 提供的 $route.query 属性。
通过您的 URL 传递参数，例如 http://example.com/#/?amount=10 并使用 this.$route.query.amount 访问它们。
在主要组件的 mounted() 方法中更新您的 vuex 商店。