vue 跳添加编辑页面传两个值_vue两个组件间值的传递或修改方式

1、可以用公共的父组件来实现;

2、可以在store.js里面在设置公共变量;

3、也可以用本地存储localStorage.setItem()和localStorage.getItem(),通过修改本地存储的值和获取修改后的值来实现;

4、就是父子组件间的值的传递与修改props,这里需要注意的是子组件里面不      能直接修改props里面接受的值,需要定义一个中间变量来接受props里的值并修改,通过$emit即this.$emit('checkDisplay',this.displayChild);来传给父组件

5、也可以通过路由来传值query,params,

a、  //跳转页面并传值

this.$router.push({path:'/index',query:{name:'haha'}})

//获取传递过来的数据

this.$route.query.name

b、 或者是 //跳转页面并传值

要记住的是params只能用name跳转,如果用path来传值则传不过去  ,而且这种传值页面刷新后所传值将清空

this.$router.push({name:'index',params:{name:'nana'}})

//获取传递过来的数据

this.$route.params.name

c、也可以直接传值

this.$router.push('/index/'+item.name) //跳转页面并传值,不过这种传值前提需在路由里面在路径后面添加“/路径/:参数名”

this.$route.params.参数名 //获取数据

但是这种方式会在地址栏显示数据,不安全

6、路径地址传值,params、query是什么?

params:/router1/:id ,/router1/123,/router1/789 ,这里的id叫做params,及上面方法c

query:/router1?id=123 ,/router1?id=456 ,这里的id叫做query。和上面方法a同理

当你使用params方法传参的时候,要在路由后面加参数名,并且传参的时候,参数名要跟路由后面设置的参数名对应。使用query方法,就没有这种限制,直接在跳转里面用就可以。

总结

以上所述是小编给大家介绍的vue两个组件间值的传递或修改方式,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对我们网站的支持!

本文标题: vue两个组件间值的传递或修改方式

本文地址: http://www.cppcns.com/ruanjian/java/232038.html

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/560845.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

(贪心)均分纸牌

题目描述 有 N 堆纸牌,编号分别为 1,2,…, N。每堆上有若干张,但纸牌总数必为 N 的倍数。可以在任一堆上取若于张纸牌,然后移动。移牌规则为:在编号为 1 堆上取的纸牌,只能移到编号为 2 的堆上…

agilebpm脑图_设计开发平台前端框架介绍 | AgileBPM 敏捷工作流开发平台—开源免费-基于 Activiti 工作流引擎、Flowable...

目前设计平台前端是独立部署的,引入了 Angular 和 Vue,您可以根据自己技术强项 选择使用 Angular 或者 Vue,他们引入的成本都很小。比如我们团队使用 Angular 很多年了,依赖注入,模块化概念很舒服,使用它构…

(贪心)删数问题

题目&#xff1a; 键盘输入一个高精度的正整数&#xff4e;&#xff08;<240位&#xff09;&#xff0c; 去掉任意&#xff53;个数字后剩下的数字按原左右次序将组成一个新的正整数。 编程对给定的&#xff4e;和&#xff53;&#xff0c;寻找一种方案&#xff0c;使得剩…

alsa的动态库安装在哪里_Linux链接库一(动态库,静态库,库放在什么路径下)...

http://www.cppblog.com/wolf/articles/74928.htmlhttp://www.cppblog.com/wolf/articles/77828.htmlhttp://www.jb51.net/article/34990.htm大部分内容抄的以上文章的。1 库的分类根据链接时期的不同&#xff0c;库又有静态库和动态库之分。静态库是在链接阶段被链接的(好像是…

递推:约瑟夫环

约瑟夫环&#xff08;约瑟夫问题&#xff09; 是一个数学的应用问题&#xff1a;已知n个人&#xff08;以编号1&#xff0c;2&#xff0c;3…n分别表示&#xff09;围坐在一张圆桌周围。从编号为k的人开始报数&#xff0c;数到m的那个人出列&#xff1b;他的下一个人又从1开始…

pic pwm 占空比可调 源码_PIC16F914输出可调占空比PWM波形程序

#includetypedef unsigned int uint;typedef unsigned char uchar;#define KEY0_DOWN() (RB40)//定义按键按下__CONFIG(0X1014);//内部时钟uchar KEY0_FLAG0;/*************************///OSC SET; INTER 4MHZ PERIOD 1US/*************************/void OSC_INIT(){OSCCON0…

(递推)三角形分割平面问题

题目描述 用N个三角形最多可以把平面分成几个区域? 输入 输入数据的第一行是一个正整数T(1<T<10000),表示测试数据的数量.然后是T组测试数据,每组测试数据只包含一个正整数N(1<N<10000). 输出 对于每组测试数据,请输出题目中要求的结果. 样例输入 2 1 …

floquet端口必须沿z轴设置_Ansys Workbench 振动给料机偏心轴的模态分析

张哲维 于 岩 刘传峰 公 业振动给料机主要由振动机架、弹簧、振动器电机等组成。振动器是由两个特定位置的偏心轴以齿轮相啮合组成&#xff0c;装配时必须使两齿轮按标记相啮合&#xff0c;通过电机驱动&#xff0c;使两偏心轴旋转&#xff0c;从而产生巨大合成的直线激振力&am…

(贪心)活动选择

问题描述 有一个需要使用每个资源的n个活动组成的集合S {a1&#xff0c;a2&#xff0c;&#xff0c;an },资源每次只能由一个活动使用。每个活动a都有一个开始时间和结束时间&#xff0c;且 0< s < f < 。一旦被选择后&#xff0c;活动a就占据半开时间区间[s,f]。如果…

vue如何配置服务器端跨域_vue项目里如何配置本地代理实现跨域请求

1、在如图项目配置的index.js文件夹下添加以下一段话微信图片_20180912182204.pngproxyTable: {/rest: {target: http://192.168.20.223:8080, pathRewrite: {"^/rest": /rest },// secure: false, changeOrigin: true }},代码中的rest只是在请求接口时本人自定义的一…

cp命令显示进度条_干货|| Linux常用命令大全

Linux常用命令目录操作命令ls命令名称&#xff1a;ls命令英文原意&#xff1a;list命令所在路径&#xff1a;/bin/ls执行权限&#xff1a;所有用户功能描述&#xff1a;显示目录文件ls (显示当前目录下文件)ls 目录名 (显示指定目录下文件)ls -l (长格式显示目录文件)ls -l 文件…

(贪心)整数区间

题目 找到一个含元素个数最少的集合,使得对于每一个区间,都至少有一个整数属于该集合&#xff0c;输出该集合的元素个数。 输入 首行包括区间的数目n,1≤n≤10000,接下来的n行,每行包括两个整数a,b,被一空格隔开,0≤a≤b≤10000,它们是某一个区间的开始值和结束值。 输出 …

二进制法生成1-n的子集

先上代码&#xff1a; #include<iostream> using namespace std;void print_subset(int n, int s){for(int i0;i<n;i)if(s&(1<<i)){printf("%d",i);} printf("\n");} int main(){int n;cin>>n; for(int i0;i<(1<<n);i)…

centos 等保三级_等保测评三级整改-身份鉴别

a)应对登录的用户进行身份标识和鉴别&#xff0c;身份标识具有唯一性&#xff0c;身份鉴别信息具有复杂度要求并定期更换&#xff1b;在linux&#xff0c;设置密码复杂度的方法有几个1. 一个是在/etc/login.defs文件&#xff0c;里面几个选项PASS_MAX_DAYS 90 #密码最长过期天数…

k3 审核流程图_K3操作流程图

目录一、流程图符号说明&#xff1a; ______________________________________________ 3二、K/3系统基础操作流程图&#xff1a; ___________________________________ 4A、“中间层—账套管理”_________________________________________________ 4 B&#xff1a;系统基础资…

c#中connect函数_Flink算子使用方法及实例演示:union和connect

Flink的Transformation转换主要包括四种&#xff1a;单数据流基本转换、基于Key的分组转换、多数据流转换和数据重分布转换。读者可以使用Flink Scala Shell或者Intellij Idea来进行练习&#xff1a;Flink Scala Shell&#xff1a;使用交互式编程环境学习和调试FlinkFlink 01 |…

(分治)取余运算

题目描述 输入b&#xff0c;p&#xff0c;k的值&#xff0c;求b^p mod k的值。其中b&#xff0c;p&#xff0c;k*k为长整型数。 输入 输入b&#xff0c;p&#xff0c;k的值。 输出 求b^p mod k的值。 样例输入 2 10 9 样例输出 2^10 mod 97 余数公式&#xff1a; a*…

java移动端接口测试_借助Charles来测试移动端-下篇

本篇是借助Charles来测试移动端的下半篇。(上篇任意门点我)上次说到可以借助Charles来抓移动端的网络请求&#xff0c;接下来&#xff0c;我们来看一下怎么通过Charles来模拟返回&#xff0c;还是以网页版豆瓣为例。先找到网页版豆瓣的请求通过上面这句话&#xff0c;我们知道&…

仓库货位卡标识牌_【干货】仓库布局,你想学啊,我教你啊!

下面两张仓库布局图&#xff0c;哪一个更加好&#xff1f;那再来看下这两张对比图&#xff0c;哪个布局更加好&#xff1f;为什么要关注仓库布局&#xff1f;在仓库操作中&#xff0c;什么操作最耗时&#xff1f;有一个大概的统计&#xff0c;假如说总工作量是100%的话&#xf…

(回溯Uva524)素数环

题目 输入正整数&#xff0c;把整数1&#xff0c;2&#xff0c;3&#xff0c;&#xff0c;n组成一个环&#xff0c;使得相邻两个整数之和均为素数。输出时从整数1开始逆时针排列。同一个环应恰好输出一次。n<16 样例输入 6 样例输出 1 4 3 2 5 6 1 6 5 2 3 4 分析与解…