主题:组建的封装
 一:install注册的全局封装(v-grid九宫格组建)
 
            1.九宫格的封装主要有三个api 点击功能 每行个数 是否隐藏边框
 
            2.因为九宫格的内容自定义的可能性比较大,美容比较灵活,所以使用了slot插件,主要让用户自定义
 
            3.主要技术就是组建中的传参
 
二: prototype原型的全局封装(v-cnfirm框)
            1.主要功能,点击后跳出弹出框,弹出框内容自定义,confirm和cancel两个回调函数
 
            2.子组件与父组建中的数据双向绑定,子组件中绑定 v-modle 需要用 value值进行接受,同时导出input事件进行数据双向数据绑定
 
            3. 创建一个vue实例构造器,之后构造一个实例,这个构造的使用相当与传入的实例,创建一个div把div挂载到内部
        
            4.数据处理 把传入的值复制到创建的实例,然后全局使用即可
 

全局组建封装(挂载到vue实例的原型中,通过this访问)的更多相关文章

  1. 3分钟教会你把封装的js公共方法挂载在vue实例原型上

    第一步:首先在src文件夹里面创建一个通用js文件夹,然后在创建的文件夹里面创建一个js文件 第二步:const 一个方法,然后通过export暴露出来(在同一个页面可以写多个方法,和暴露多个方法,在 ...

  2. 把axios挂载到vue实例上面/==Axios 各种请求方式传递参数格式

    /*ajax请求*/   import axios from 'axios'   axios.defaults.baseURL = 'https://api.douban.com/v2/movie' ...

  3. python 全栈开发,Day91(Vue实例的生命周期,组件间通信之中央事件总线bus,Vue Router,vue-cli 工具)

    昨日内容回顾 0. 组件注意事项!!! data属性必须是一个函数! 1. 注册全局组件 Vue.component('组件名',{ template: `` }) var app = new Vue ...

  4. vue实例讲解之vue-router的使用

    实例讲解系列之vue-router的使用 先总结一下vue-router使用的基本框架: 1.安装并且引入vue-router 安装:npm install vue-router --save-dev ...

  5. Vue.js-07:第七章 - Vue 实例的生命周期

    一.前言  在之前的 Vue 学习中,我们在使用 Vue 时,都会创建一个 Vue 的实例,而每个 Vue 实例在被创建时都要经过一系列的初始化过程.例如,需要设置数据监听.编译模板.将实例挂载到 D ...

  6. vue项目中 如何让外部引入的js模块 的this值 指向vue实例

    当前是vue项目,想在tool.js(工具模块)中封装一个跳转页面的方法, goToUrl(name,query){ if(query){ if(query.addressCode){ vueObje ...

  7. Vue框架(一)——Vue导读、Vue实例(挂载点el、数据data、过滤器filters)、Vue指令(文本指令v-text、事件指令v-on、属性指令v-bind、表单指令v-model)

    Vue导读 1.Vue框架 vue是可以独立完成前后端分离式web项目的js框架 三大主流框架之一:Angular.React.Vue vue:结合其他框架优点.轻量级.中文API.数据驱动.双向绑定 ...

  8. Vue源码分析(二) : Vue实例挂载

    Vue源码分析(二) : Vue实例挂载 author: @TiffanysBear 实例挂载主要是 $mount 方法的实现,在 src/platforms/web/entry-runtime-wi ...

  9. Vue 实例挂载的实现(六)

    Vue 中我们是通过 $mount 实例方法去挂载 vm 的,$mount 方法在多个文件中都有定义,如 src/platform/web/entry-runtime-with-compiler.js ...

随机推荐

  1. 导出excel时设置单元格格式(避免类似0100的数字丢失前面的0)

    <td style="vnd.ms-excel.numberformat:@;"><s:property value="accountCode" ...

  2. js获取url参数,直接获取url中文

    function GetQueryString(name)//name参数名称 { var reg = new RegExp("(^|&)"+ name +"=( ...

  3. Multiple APK Support

    [Multiple APK Support] Multiple APK support is a feature on Google Play that allows you to publish d ...

  4. Python调用sqlAlchemy

    import logging from sqlalchemy import Column, String, create_engine from sqlalchemy.ext.declarative ...

  5. 工单进入IN_MO后在FP_PREPROCESS被过滤

    '; --BOM and item not in IN_ITEMBOMROUTING SELECT * FROM TEMP_REMOVED_IN_DATA WHERE TABLE_NAME='IN_M ...

  6. elastic search 查询

    eelastic search主要有两种查询方式,一种是查询字符串,一种是请求体(json格式)查询. 查询字符串: 查询字符串的功能相对简单,使用容易. 比如GET http://localhost ...

  7. PHPActiveRecord validates

    validates_presence_of #检测是不是为空 为空的话可以抛出异常 *Model类: static $validates_presence_of = array( array('tit ...

  8. c++ STL模板(一)

    一.sort函数 1.头文件:#include < algorithm>: 2.它使用的排序方法是类似于快排的方法,时间复杂度为n*log2(n): 3.Sort函数有三个参数:(第三个参 ...

  9. 第二章 向量(d3)有序向量:Fibonacci查找

  10. <asp:Button点击查询后,调用js中函数展现加载圈

    <div> <div id='paneloading' style='display:none;position:fixed;top:0px;left:0px;z-index:999 ...