link传递参数
合集下载
- 1、下载文档前请自行甄别文档内容的完整性，平台不提供额外的编辑、内容补充、找答案等附加服务。
- 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
- 3、如文档侵犯您的权益，请联系客服反馈,我们会尽快为您处理(人工客服工作时间：9:00-18:30)。
在Vue.js中，我们通常使用router-link和Link模块两种方式来传递参数。
1. 使用router-link传递参数：我们可以利用params和方法query来实现。
例如，<
```html
<!-- query方式-->
<router-link :to=" {path:'/page1',query: {username}}"> page1 </router-link>
<!-- params方式-->
<router-link :to=" {name:'page2',params: {username1}}"> page2 </router-link>
```
在上述代码中，我们通过`query`属性将参数添加到URL的查询字符串中，并通过`params`属性将参数直接添加到URL路径中。
2. 使用Link模块传递参数：首先，我们需要引入Link模块，然后在Link标签中带上要传递的参数。
最后，在跳转页面接收参数。
具体实现如下：
```javascript
import { Link } from 'dva/router';
//...
<Link to= { { pathname:`/要跳转的路径`, state: {key值：val值} } }>
```
在上述代码中，我们通过`state`对象将参数添加到URL的查询字符串中，并在目标页面通过`this.props.location.state`获取这些参数。