vue传参的三种方式

1.在path中添加/:id来对应 $router.push 中path携带的参数。在子组件中可以使用来获取传递的参数值。

方案一：

实现：

在组件two中点击时会将点击的城市名传递到city组件中

路由配置如下

city组件以及接收传来的参数的方式

效果

点击聊城，在跳转到city组件之后，将聊城这个参数也传递了过来。

方案二：

实现：

在组件main中点击对应的季节将该参数传递到跳转的MainD组件中

组件MainD接参

效果：

点击夏天跳转页面之后，在MainD页面显示夏天

方案三：平常最常用的一种方式

实现：

在组件list中向listDetail组件中传递对应的多个参数

路由配置

组件listDetail中以及接收参数

相当于在list组件中点击列表，在listDetail组件中，显示点击的列表项的详情

效果：

以上便是vue传参常见的三种方式

1、新建html文档，在head标签中引入vue的js文件。

2、在body标签中添加一个id为“app”的div标签。

3、在这个div标签中再添加一个div标签，在vue中添加一个变量数据。

4、用浏览器打开html文档，这时可以在页面中看到被v-html指令添加的html元素。

vue项目中经常会用到element ui，有时候需要修改默认的样式，比如表格，导航栏等，输入框等等。

可以用以下两种方式修改：

1.给组件加上id或者class，然后添加一个style，不要加scoped（vue可以有多个style），在组件里直接修改

2.外部引入css文件，默认样式会被覆盖

3.利用深度::v-deep深度修改组建的样式，可以直接写在到scoped作用域的style里面。（推荐）

也可以在外层加一个div，然后赋值一个class或者id，在scss中用这种语法修改对应的组件上的class名字即可

---