index.html 需要携带参数 给组件

在`index.html`中携带参数传递给Vue组件通常是在URL查询字符串中完成的。如果你需要向组件传递特定数据，比如一个id或者状态信息，你可以这样做：

1. **URL编码**：将数据转换为URL安全的格式，例如将JavaScript变量转义为`encodeURIComponent()`。例如，假设你想传递一个ID `myParam = '123'`，则变为`'?param=123'`。

2. **修改HTML**：在`<script>`标签引入Vue之前，更新`index.html`的链接，添加查询参数：

   <script src="/path/to/vue.min.js?params={{ encodedParam }}"></script>

其中`encodedParam`是经过编码的参数值，比如`encodeURIComponent('myParam')`。

3. **接收参数**：在你的Vue组件里，你可以监听`created`生命周期钩子，从URL查询参数中解码并获取参数：

   <script>
   import { mapState } from 'vuex';

   export default {
     created() {
       const decodedParam = decodeURIComponent(this.$route.query.params.param);
       this.myParam = decodedParam; // 或者将其放入Vuex store或data中
     },
     computed: {
       ...mapState(['otherState']), // 如果有来自Vuex的状态也需要映射
     },
   }
   </script>