vue_03总结
vue_03总结
1、组件:
html、css、js的集合体
vue实例就代表组件
组件用template实例成员管理html结构,有且只有一个根标签
子组件可以复用,所以数据要组件化处理,data的值由方法的返回值提供
2、分类:
根组件:new Vue({}),顶级组件
全局组件: Vue.component('组件名', {}),不用注册可以在任何地方使用
局部组件:let 组件名 = {},只有在注册的父组件中才能使用
3、组件间传参:
父传子:自定义属性
<tag :info="msg"></tag>
let tag = {
props: ['info'],
}
new Vue({
data: {msg: 12345}
components: {
tag,
}
})
子传父:自定义事件
<tag @action="fn"></tag>
let tag = {
data: {msg: 12345},
methods: {
tag_fn() {
this.$emit('action', this.msg)
}
}
}
new Vue({
components: {
tag,
},
methods: {
fn(info) {}
}
})
4、vue项目环境
官网下载安装node => 将npm换源为cnpm => cnpm install -g @vue/cli
=> vue项目创建...
vue_03总结的更多相关文章
- vue_03 练习
1.有以下广告数据(实际数据命名可以略做调整) ad_data = { tv: [ {img: 'img/tv/001.png', title: 'tv1'}, {img: 'img/tv/002.p ...
随机推荐
- [转帖]Asp.net MVC 与 Asp.net Web API 区别
Asp.net MVC 与 Asp.net Web API 区别 https://www.cnblogs.com/viktor988/ https://www.cnblogs.com/terry283 ...
- Win10修改字体
先将自己喜欢的字体下载下来. 把自己喜欢的字体下载之后,一般会是一个压缩包,将其解,格式是ttf. 点击解压后的字体文件,将其安装在windows系统之中. 键盘上先按住win,在按R,出现一个窗口, ...
- Centos7查看关闭防火墙
查看防火墙状态: firewall-cmd --state 关闭防火墙 service firewalld start 开机启动 service firewalld stop 禁止开机启动 syste ...
- shiro整合shiro多验证登录(账号密码登录和使用手机验证码登录)
1. 首先新建一个shiroConfig shiro的配置类,代码如下: @Configuration是标识这个类是一个配置文件,在启动时会加载这个类里面的内容,这个配置文件的位置的一定一定一定不能 ...
- LC 599. Minimum Index Sum of Two Lists
题目描述 Suppose Andy and Doris want to choose a restaurant for dinner, and they both have a list of fav ...
- Linux (x86) Exploit 开发系列教程之四(使用return-to-libc绕过NX bit)
(1)原理: “NX Bit”的漏洞缓解:使某些内存区域不可执行,并使可执行区域不可写.示例:使数据,堆栈和堆段不可执行,而代码段不可写. 在NX bit打开的情况下,基于堆栈的缓冲区溢出的经典方法将 ...
- pt-online-schema-change使用
MySQL ddl 的问题现状 在 运维mysql数据库时,我们总会对数据表进行ddl 变更,修改添加字段或者索引,对于mysql 而已,ddl 显然是一个令所有MySQL dba 诟病的一个功能,因 ...
- Partial的应用
Partial是局部类型的意思.允许我们将一个类.结构或接口分成几个部分,分别实现在几个不同的.cs文件中.C#编译器在编译的时候仍会将各个部分的局部类型合并成一个完整的类 局部类型的注意点1. 局部 ...
- HTTP请求方式及其区别
一.请求方式 所有的请求都可以给服务器传递内容,也可以从服务器获取内容. GET:从服务器获取数据(给的少拿的多) POST:向服务器推送数据(给的多拿的少) DELETE:删除服务器的一些内容 PU ...
- vue项目中图片预览旋转功能
最近项目中需要在图片预览时,可以旋转图片预览,在网上找了下,发现有一款功能强大的图片组件:viewerjs. git-hup: https://github.com/fengyuanchen/view ...