vue中把props中的值赋值给data
vue中把props中的值赋值给data
父组件:
<template>
<div>
<navbar :ctype="ctype"></navbar>
</div>
</template>
<script>
import navbar from '@/components/navbar'
export default {
components: {navbar},
data () {
return{
ctype:1
}
}
}
</script>
子组件:
<template>
<div>
<div>{{thistype}}</div>
</div>
</template>
<script>
export default {
props:['ctype'],
computed: {
normalizedSize: function () {
return this.ctype.trim().toLowerCase()
}
},
data(){
return{
thistype:this.ctype
}
}
}
</script>
vue中把props中的值赋值给data的更多相关文章
- c语言中的结构体为值类型,当把一个结构体赋值给另一个结构体时,为值传递
#include <stdio.h> int main() { struct person { int age; }; }; //值传递,将p1中所有成员变量的值赋值个p2中对应的成员变量 ...
- vue.js实战——props单向数据流
Vue2.x通过props传递数据是单向的了,也就是父组件数据变化时会传递给子组件,但是反过来不行. 业务中会经常遇到两种需要改变prop的情况, 一种是父组件传递初始值进来,子组件将它作为初始值保存 ...
- vue中直接修改props中的值并未给出警告,为啥?
问:vue中直接修改props中的值并未给出警告,为啥? 答:如果props传入的值是引用类型,在子组件中改变其元素,不改变引用,那么不报错: 如果是基本类型,那么在修改时浏览器控制台会有报错信息. ...
- Vue props中Object和Array设置默认值
Vue中,在props中设置Object和Array的默认值 seller: { type: Object, default() { return {} } } seller: { type: Obj ...
- vue中子组件的created、mounted钩子中获取不到props中的值问题
父子组件通信 这个官网很清楚,也很简单,父组件中使用v-bind绑定传送,子组件使用props接收即可 例如: 父组件中: <template> <div> <head- ...
- vue中子组件的methods中获取到props中的值
这个官网很清楚,也很简单,父组件中使用v-bind绑定传送,子组件使用props接收即可 例如: 父组件中 <template> <div> <head-top>& ...
- Oracle中Clob类型处理解析:ORA-01461:仅可以插入LONG列的LONG值赋值
感谢原作者:破剑冰-Oracle中Clob类型处理解析 上一篇分析:ORA-01461: 仅能绑定要插入 LONG 列的 LONG 值 最近为Clob字段在插入数据时发现当字符的字节数(一个半角字符一 ...
- vue 路由meta作用及在路由中添加props作用
vue路由meta:有利于我们处理seo的东西,我们在html中加入meta标签,就是有利于处理seo的东西,搜索引擎 在路由中传参是通过/:id传参代码如下: import Login from ' ...
- 怎样在 Vue 的 component 组件中使用 props ?
1. 在注册一个组件时, 添加一个 props 属性, 将需要添加的 props 作为数组的元素进行添加, 比如下面的例子中, 我们添加了一个变量 name , 他就是一个 props, 我们可以通过 ...
随机推荐
- Image splicing forgery detection combining coarse to refined convolutional neural network and adaptive clustering
粗到精的卷积神经网络与自适应聚类相结合的图像拼接篡改检测 研究方向:图像篡改检测 论文出处:ELSEVIER A类 学校:西安电子科技大学网络工程学院.重庆邮电大学计算机科学与技术学院 关键字:Spl ...
- asp.net core-3.应用程序部署到iis
asp.net core在部署到iis 上的时候,iis服务器要装一个AspNetCoreModule,网站—>模块 具体下载地址可以去网上搜索https://www.nuget.org/pa ...
- (转)从0移植uboot (四) _点亮调试LED
这一节主要讨论1个问题:点灯.点灯是实际开发中,特别是裸板开发中常见的调试手段,相当于主机开发中漫天飞舞的printf/printk.为了追踪程序的现场执行情况,很多时候我们都使用点一个灯的方法来进行 ...
- (十五)struts2之注解
一.作用 以用来替换struts.xml配置文件 使用前提 :必须引入struts2-convention-plugin-2.3.14.jar 这个jar包 二.参数 @Action来代替<ac ...
- VS2019编译 当前最新版chromium
之前编译过webrtc和chromium, 由于长时间没用,被我删除了, 最近在最新版本的google浏览器上遇到了播放器兼容性问题,老版本的google浏览器是没问题,IE, 火狐浏览器也没问题, ...
- Python练习_数据类型_day4
题目 1.作业 1,写代码,有如下列表,按照要求实现每一个功能 li = ["alex", "WuSir", "ritian", " ...
- Android三种菜单的使用方式
一.选项菜单(OptionMenu) 在res目录下新建menu目录,用于放置菜单布局文件(右键res->new->Android Resource Directory->menu) ...
- 【算法】php实现排序(一)
选择排序方式:先让第一位与其他位比较大小找到最小的数字,然后是第二位与除第一位的其他位比较大小找出第二位,依此类推 $arr = [2,45,12,67,33,5,23,132,46]; for ($ ...
- vue——store全局存储
业务场景:刷新页面时,首次拉取所有配置,存储到store状态管理用于全局调用: import Vue from 'vue' import Vuex from 'vuex' import userInf ...
- MVC方式显示数据(手动添加数据)
Model添加类 Customers using System; using System.Collections.Generic; using System.Linq; using System.W ...