vue组件之间通过query传递参数
需求:
从 任务列表进入 任务详情 ,向详情页传递当前 mission_id 值
路由关系:
//查看任务列表
{
path: '/worklist',
name: 'worklist',
component: worklist,
},
//任务详情
{
path: '/workdetails',
name: 'workdetails',
meta: {
requireAuth: true //需要先登录
},
component: workdetails
},
worklist.vue传递
<router-link :to="{
path: '/workdetails',
query: {
mission_id: index.mission_id //当前missionID
}
}"
class="aaalistlink">
<el-button icon="el-icon-search" circle type="danger" class="check"></el-button>
</router-link>
workdetails.vue 中接收参数
var data = {
mission_id : this.$route.query.mission_id, //传递的missionID
user_id : this.$store.state.user_id
}
vue组件之间通过query传递参数的更多相关文章
- vue组件之间数据的传递
父子组件通信 父组件向子组件传递数据: 1.通过子组件的 props 选项声明它期待获得的数据,用以接收父组件传过来的值. 2.在子组件标签中使用子组件props中创建的属性 3.父组件中注册子组件 ...
- vue 组件之间的数据传递
父组件传数据给子组件 创建数据 获取json数据 子组件传数据给父组件 1. 子组件使用$emit监听数据 getAreaValues(){ this.$emit('getAreaValues', { ...
- Vue 爬坑之路(二)—— 组件之间的数据传递
Vue 的组件作用域都是孤立的,不允许在子组件的模板内直接引用父组件的数据.必须使用特定的方法才能实现组件之间的数据传递. 首先用 vue-cli 创建一个项目,其中 App.vue 是父组件,com ...
- Vue基础知识之组件及组件之间的数据传递(五)
vue中的组件是自定的标签,可以扩展的原生html元素,封装可复用的代码 note: 1.在标签命中不要使用大写,标签名字必须用短横线隔开 2.模板中只能有一个根元素,不能使用并列标签. 定义组件 全 ...
- (转)Vue 爬坑之路(二)—— 组件之间的数据传递
Vue 的组件作用域都是孤立的,不允许在子组件的模板内直接引用父组件的数据.必须使用特定的方法才能实现组件之间的数据传递. 首先用 vue-cli 创建一个项目,其中 App.vue 是父组件,com ...
- 解决vue不相关组件之间的数据传递----vuex的学习笔记,解决报错this.$store.commit is not a function
Vue的项目中,如果项目简单, 父子组件之间的数据传递可以使用 props 或者 $emit 等方式 进行传递 但是如果是大中型项目中,很多时候都需要在不相关的平行组件之间传递数据,并且很多数据需要 ...
- Vue之组件之间的数据传递
Vue的组件作用域都是孤立的,不允许在子组件的模板内直接引用父组件的数据,必须使用特定的方法才能实现组件之间的数据传递. 下列为在vue-cli创建项目中的操作 一·父组件向子组件传递数据 在Vue中 ...
- 【整理】解决vue不相关组件之间的数据传递----vuex的学习笔记,解决报错this.$store.commit is not a function
解决vue不相关组件之间的数据传递----vuex的学习笔记,解决报错this.$store.commit is not a function https://www.cnblogs.com/jaso ...
- vue.js 同级组件之间的值传递方法(uni-app通用)
vue.js 兄弟组件之间的值传递方法 https://blog.csdn.net/jingtian678/article/details/81634149
随机推荐
- pom.xml中若出现jar not found;
pom.xml中若出现jar not found;我们可以直接在view ->tool windows ->Maven Project 中直接install
- java定时(循环)执行一个方法
java中设置定时任务用Timer类可以实现. 一.延时执行 首先,我们定义一个类,给它取个名字叫TimeTask,我们的定时任务,就在这个类的main函数里执行.代码如下: package test ...
- cloud-music
非常感谢那些无私开源的程序员,希望我也能够有能力像你们那样,开源很多很有意思的东西~~ //index.html <!DOCTYPE html> <html> <head ...
- twitter、facebook、pinterest、linkedin 分享代码
twitter.facebook.pinterest.linkedin 分享代码 http://www.cnblogs.com/adstor-Lin/p/3994449.html
- 使用Data Lake Analytics读/写RDS数据
Data Lake Analytics 作为云上数据处理的枢纽,最近加入了对于RDS(目前支持 MySQL , SQLServer ,Postgres 引擎)的支持, 这篇教程带你玩转 DLA 的 R ...
- 让开发部署提速 8 倍,我参与贡献这款 IDE 插件的全过程
如何像参与开源那样,去参与一款 IDE 插件的设计? 作为一款 IDE 插件的使用者,我是否能决定下一个版本的功能? 自从产品经理银时小伙和他的开发小哥们在去年12月发布 Cloud Toolkit( ...
- 基于opencv的RandomForest随机森林
2.OpenCV函数使用 OpenCV提供了随机森林的相关类和函数.具体使用方法如下: (1)首先利用CvRTParams定义自己的参数,其格式如下 CvRTParams::CvRTParams(in ...
- 从零学React Native之08Image组件
开发过程中, 几乎每个项目都会用到图片. RN就是通过Image组件显示图片.既可以加载网络图片,也可以加载本地资源图片. Image组件必须在样式中声明图片的款和高.如果没有声明,则图片将不会被呈现 ...
- 罗列Python标准模块
文本 1. string:通用字符串操作 2. re:正则表达式操作 3. difflib:差异计算工具 4. textwrap:文本填充 5. unicodedata:Unicode字符数据库 6. ...
- 洛谷P1616 疯狂的采药
//完全背包 #include<bits/stdc++.h> using namespace std; ; ; int n,m,v[maxn],w[maxn],f[maxv]; int m ...