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

一、在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. phpstorm设置xdebug调试

    phpstorm设置xdebug调试# wamp开发环境安装完成以后,打开网页,输入 :localhost 检测xdebug是否开启 3.若xdebug已开启,请找到你wamp或者phpstudy的安 ...

  2. Pytorch入门——手把手带你配置云服务器环境

    本文始发于个人公众号:TechFlow,原创不易,求个关注 今天这篇是Pytorch专题第一篇文章. 大家好,由于我最近自己在学习Pytorch框架的运用,并且也是为了响应许多读者的需求,推出了这个P ...

  3. 入门大数据---Kafka深入理解分区副本机制

    一.Kafka集群 Kafka 使用 Zookeeper 来维护集群成员 (brokers) 的信息.每个 broker 都有一个唯一标识 broker.id,用于标识自己在集群中的身份,可以在配置文 ...

  4. 【转】HBase中Zookeeper，RegionServer，Master，Client之间关系

    在2.0之前HDFS中只有一个NameNode,但对于在线的应用只有一个NameNode是不安全的,故在2.0中对NameNode进行抽象,抽象成NamService其下包含有多个NameNode,但 ...

  5. caffe训练数据流程

    cifar10训练实例 1. 下载数据 # sudo sh data/cifar10/get_cifar10.sh 2. 转换数据格式为lmdb # sudo sh examples/cifar10/ ...

  6. webstom 汉化，激活

    1.激活 本地服务器激活: 下载 magnet:?xt=urn:btih:2289E4F8CEB346AC44E54C8C0DA706CC537301AA 得到一个压缩包IntelliJIDEALic ...

  7. 【贪心】Emergency Evacuation

    题目 大致题意 把指定的人从同一出口送出车外,且同一位置不能同时有两个人,求所需的最短时间. 分析 第一感觉就是利用贪心思想解决问题,但是这道题的数据范围用模拟的话肯定是会爆掉的,所以这是不可取的.我 ...

  8. Python趣味入门4:选择往往是最重要的-条件语句

    人生处处有选择,程序也有选择,为了让程序变得更加强壮,程序员必须考虑任何情况,上一篇了解到了如何使用Python来行顺序语句的编写,我们写了一个可以输入姓名的生日祝贺程序,今天我们挑战条件语句! 1. ...

  9. 每日一题 - 剑指 Offer 32 - III. 从上到下打印二叉树 III

    题目信息 时间: 2019-06-25 题目链接:Leetcode tag:双端队列 难易程度:中等 题目描述: 请实现一个函数按照之字形顺序打印二叉树,即第一行按照从左到右的顺序打印,第二层按照从右 ...

  10. css重设样式_清除浏览器的默认样式

    由于不同的浏览器默认的样式也不同,所以在网页开发前设置一个公用样式,来清除各个浏览器的默认样式,已达到做的网页在各个浏览器中达到统一. 收集的默认样式的链接地址: 1.eric-meyer-reset ...