我们在搭建好的手脚架中 进行使用

一、在src =》components => 创建XXbtn文件夹用来存放你的组件 =》在创建一个vue的文件 。

二、在src =》 components =》 创建index.js 用来注册你的组件

三、编辑组件内容

我这边是仿element-ui的一个输入框的功能组件。很简单的一个。

四、编辑index.js

这个地方的name名是你使用的时候的名字。最好就用同一个,就好。

五、在main.js中引入 index.js

六、使用

在需要使用的地方直接使用就好

 

这边因为需要把子组件里的内容给传过来,

vue怎么自定义组件的更多相关文章

  1. vue中自定义组件(插件)

    vue中自定义组件(插件) 原创 2017年01月04日 22:46:43 标签: 插件 在vue项目中,可以自定义组件像vue-resource一样使用Vue.use()方法来使用,具体实现方法: ...

  2. 【VUE】自定义组件

    [VUE]自定义组件 转载: ============================================ ======================================== ...

  3. vue的自定义组件和组件传值

    <div id="app"> <div>{{pmessage}}</div> //父组件 <child :message="pm ...

  4. vue之自定义组件

    除了核心功能默认内置的指令外,vue也允许用户注册自定义指令.虽然在vue2.0中,代码复用和抽象的主要形式是组件,但是有些情况下,我们仍需要对普通DOM元素进行底层操作,这个时候就需要用到自定义指令 ...

  5. vue 相邻自定义组件渲染错误正确的打开方式

    话不多说看问题: 当封装自定义组件时例如(自定义下拉列表)两个相同的组件在多次v-if变化时偶尔会发生渲染错误,明明赋值正确但是组建中的ajax方法可能返回的数据乱掉,或者其他神逻辑错误. 经过查询发 ...

  6. 编程小白入门分享五:Vue的自定义组件

    前言 上篇博客简单介绍了vue,本篇博客要在对vue有一定了解后,才可以比较容易理解自定义组件.想要封装好一个组件,一定要熟练掌握这三个技能,父组件 -> 子组件传值(props).子组件 -& ...

  7. 四、vue基础--自定义组件

    1.语法:Vue.component("组件名字",{data,template}),代码如下: a. data: 必须是一个函数,有一个返回值.和vue里面的使用方法一样 b. ...

  8. vue发布自定义组件到npm

    一.使用 vue create currentdatetime创建项目(可查考https://cli.vuejs.org/zh/guide/creating-a-project.html),创建成功后 ...

  9. Vue之自定义组件的v-model

    最近在学习vue,今天看到自定义事件的表单输入组件,纠结了一会会然后恍然大悟...官方教程写得不是很详细,所以我决定总结一下. v-model语法糖 v-model实现了表单输入的双向绑定,我们一般是 ...

  10. Vue的自定义组件之间的数据传递

    一,父级传向子级 1,在子级的属性中添加props:['myname',......],参数可以传多个,看具体而定: 2,在父级data中定义好需要传递的变量数据,例如name:"rose& ...

随机推荐

  1. 入门大数据---Spark_Streaming与流处理

    一.流处理 1.1 静态数据处理 在流处理之前,数据通常存储在数据库,文件系统或其他形式的存储系统中.应用程序根据需要查询数据或计算数据.这就是传统的静态数据处理架构.Hadoop 采用 HDFS 进 ...

  2. Web安全之暴力破解

    暴力破解,顾名思义简单粗暴直接,我理解为将所有的“答案”都进行尝试直到找到正确的“答案", 当然我们不可能将所有的“答案”都进行尝试,所以我们只能将所有最有可能是正确的“答案”进行尝试即可 ...

  3. ABP(ASP.NET Boilerplate Project)快速入门

    前言 这两天看了一下ABP,做个简单的学习记录.记录主要有以下内容: 从官网创建并下载项目(.net core 3.x + vue) 项目在本地成功运行 新增实体并映射到数据库 完成对新增实体的基本增 ...

  4. Python之浅谈继承

    目录 继承 继承介绍 如何使用继承 新式类:只要继承了object类,就是新式类,再python3中,默认继承object类 经典类:没有继承object的类,就是经典类 利用继承减少代码冗余,菱形问 ...

  5. linux就该这么学 第一天学习笔记

    题外话 在每天的网上冲浪中,一次无意间的点击,发现了linux就该这么学的网站,然后就看了一晚上,当时还是学生的我特别想要参加培训,可是碍于眼前的经济状况,只得将这个想法深深的藏在了心里,并加了一下网 ...

  6. python学习_Linux系统的常用命令(二)

    linux基本命令: 1.ls 的详细操作: ls - l : 以列表方式显示文件的详细信息 ls -l -h: 以人性化的方式显示文件的大小 ls -l -h -a 显示所有的目录和文件,包括隐藏文 ...

  7. 2020年Java基础高频面试题汇总(1.4W字详细解析,你能遇到的都在这了)

    1. Java语言有哪些特点 (1)简单易学.有丰富的类库 (2)面向对象(Java最重要的特性,让程序耦合度更低,内聚性更高) (3)与平台无关性(JVM是Java跨平台使用的根本) (4)可靠安全 ...

  8. 接口测试基础——fiddler抓包常见问题

    fiddler抓包工作原理: 以web代理服务器的形式进行工作的,使用的代理地址是:127.0.0.1,端口默认为8888,过程如下:web代理就是在客户端和服务器之间设置一道关卡,客户端先将请求数据 ...

  9. 攻防世界FlatScience

    访问robots.txt发现 admin.php和login.php 在admin.php和login.php分别尝试注入 发现login.php页面存在注入,并且根据报错得知数据库类型为sqlite ...

  10. XSS与CSRF定义

    一. CSRF 1. CSRF的基本概念 跨站请求伪造(英语:Cross-site request forgery),也被称为 one-click attack 或者 session riding,通 ...