小白学习vue第五天(理解使用组件开发,组件第一弹)
组件怎么从创建到使用?
第一步创建组件构造器对象
感觉个人理解就是创建一个模板,和创建MongoDB数据模板相似
const cpnC = Vue.extend({
template: `
<div >
<h1>我是标题</h1>
<p>我是内容</p>
</div>`
})
第二步注册组件
模板做好了就要注册一下才能用,注册成Vue的组件
Vue.component('my-cpn', cpnC)
const app = new Vue({
el: '#app',
data: {
message: "你好,世界",
},
})
第三步使用组件
<div id="app">
<my-cpn></my-cpn>
<my-cpn></my-cpn>
<my-cpn></my-cpn>
</div>
小白学习vue第五天(理解使用组件开发,组件第一弹)的更多相关文章
- 小白学习vue第五天-第二弹(全局局部、父子、注册语法糖,script/template抽离模板)
全局组件: 就是注册的位置在实例对象的外面 并且可以多个实例对象使用 而局部: 就是在实例对象的内部注册 父组件和子组件的关系 子组件就是在另一个组件里面注册的组件 组件注册语法糖: 就不用Vue.e ...
- 小白学习Vue第五天(v-model实用的地方)
用法一radio单选项 <!-- 添加name男女选项互斥 --> <label for="male"> <input type="radi ...
- 小白学习VUE第一篇文章---如何看懂网上搜索到的VUE代码或文章---使用VUE的三种模式:
小白学习VUE第一篇文章---如何看懂网上搜索到的VUE代码或文章---使用VUE的三种模式: 直接引用VUE; 将vue.js下载到本地后本目录下使用; 安装Node环境下使用; ant-desig ...
- 小白学习django第五站-简易案例
首先在setting.py文件中编写数据库配置内容 DATABASES = { 'default': { 'ENGINE': 'django.db.backends.mysql', 'NAME': ' ...
- 小白学习VUE第二课:环境搭建 VUE Node.js VSCode template模板
环境搭建 VUE Node.js VSCode template模板: 首先安装node:http://www.runoob.com/nodejs/nodejs-install-setup.html ...
- 学习vue第五节,vue中使用class和style的css样式
vue中使用class样式 数组 <h1 :class="['red', 'thin']">这是一个H1</h1> 数组中使用三元表达式 <h1 :c ...
- 小白学习vue第三天,从入门到精通(computed计算属性)
computed计算属性 <body> <div id="app"> <div>{{myName}}</div> </div& ...
- 小白学习Spark系列五:scala解析多级json格式字符串
一.背景 处理json格式的字符串,key值一定为String类型,但value不确定是什么类型,也可能嵌套json字符串,以下是使用 JSON.parseFull 来解析多层json. 二.实例代码 ...
- c#面向对象基础技能——学习笔记(五)委托技术在开发中的应用
委托 delegate 1.是一种全新的面向对象语言的特性: 2.开发事件驱动程序变得非常简单: 3.简化多线程难度. 理解委托:可以理解成一个方法的指针.(接收的变量是方法) 步骤: 1.声明委托, ...
随机推荐
- 让Qt5默认支持C++17的设置方法
单个项目的设置方法 打开项目的 pro 文件,将CONFIG += console c++11改为CONFIG += console c++17即可. 永久默认支持 c++17 的设置方法 找到 Qt ...
- Redis在linux系统中的优化
通常来看,Redis开发和运维人员更加关注的是Redis本身的一些配置优化,例如AOF和RDB的配置优化.数据结构的配置优化等,但是对于操作系统是否需要针对Redis做一些配置优化不甚了解或者不太关心 ...
- LVM磁盘管理实战案例
前言:这是关于centos/linux上的LVM磁盘上的扩容,缩减,磁盘类型等收集做的案例 至于ubuntu系统的磁盘扩容参考:https://www.jianshu.com/p/5dcfcec687 ...
- ESP32存储blog笔记
基于ESP-IDF4.1 1 #include <stdio.h> 2 #include "freertos/FreeRTOS.h" 3 #include " ...
- python对象类型
一.内置对象 对象类型 分类 是否可变 例子 数字 数值 否 123,3.12 字符串 序列 否 'test',"test's" 列表 序列 是 [1,2,3,[1,2,'test ...
- 【BZOJ 4771】七彩树
一直TLE的原因竟然是数组开太大了导致\(memset\)清空耗时超限,亏我还调了1天啊(T^T) 题目大意 给定一颗树,每个节点都有一个颜色,要求多次询问某个节点\(x\)的子树中深度不超过\(d\ ...
- Jmeter常见报错信息: ERROR - jmeter.protocol.http.proxy.ProxyControl: Could not initialise key store java.io.IOException: Cannot run program "keytool"
JMeter 2.10 用的新方法来录制HTTPS请求Java 7. 录制的过程中会碰到一些问题或者报错,就目前碰到的,做出一些总结. ERROR - jmeter.protocol.http.pro ...
- 第 3 题:如何理解 HTML5 语义化?
什么是标签语义化? 提升代码可读性,便于团队开发和维护 为什么要标签语义化? 当网页去掉 CSS 样式时,页面能呈现出来清晰的结构 案例 不存在语义化 <div></div> ...
- [刘阳Java]_Web前端入门级练习_迅雷官宣网设计
也有一段时间没有写一些技术专题文章,今天给大家来几篇Web前端入门级练习的文章.主讲<迅雷官宣网>的设计,相信大家平时也用过迅雷这个下载工具,所以分享的这篇技术大家在一定程序会感兴趣. 先 ...
- Map集合笔记
一.Map集合的特点 Map集合是一个双列集合 Map中的元素,key和value的数据类型可以相同,也可以不同. Map中的元素,key是允许重复的,value是可以重复的 Map中的元素,key和 ...