主题:组建的封装
 一: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. 基础的正则表达式与re模块(2)

    一.元字符 字符组是元字符中的一个.在字符组中所有的字符都可以匹配任意一个字符位置上能出现的内容,如果在字符串中有任意一个字符是字符组中的内容,那么就是匹配上的项. [0-9]   [a-z]    ...

  2. js基础-基本包装类型

    var t = 13; t.toString(); //t是一个简单数值类型 现在有了方法 toString 对象类型的方法 //数值类型有对应的包装类型 var t1 =new Number(333 ...

  3. 手机调试 fiddler

    使用Fiddler调试手机程序 | 前端和运维利器 2015-11-27  zhy97031  文章来源  阅 688  转 4 转藏到我的图书馆   微信分享:   作者:Uncle Chen 原文 ...

  4. destoon手机端分页

    $pages = ''; $pagesize = 2; $offset = ($page-1)*$pagesize; $rr = $db->get_one("SELECT COUNT( ...

  5. numpy--深度学习中的线代基础

    参考自 微信公众号--深度学习世界(http://mp.weixin.qq.com/s?__biz=MzI4MDMwMDM3NA==&mid=2247484616&idx=1& ...

  6. Pandas操作数据库及保存csv

    数据的保存 import pandas as pd import numpy as np from pandas import Series col_db = [['one',1,2,3,4,np.n ...

  7. 超详细 Nginx 极简教程

    什么是Nginx? Nginx (engine x) 是一款轻量级的Web 服务器 .反向代理服务器及电子邮件(IMAP/POP3)代理服务器. 什么是反向代理? 反向代理(Reverse Proxy ...

  8. Ant 使用指南 与 知识汇总

    一.Ant是什么?        Ant是一种基于Java和XML的build工具.它可以帮助我们将项目开发过程中需要完成的各种步骤组织起来,通过一个简易的方式来构建整个项目.Ant究竟能做什么呢?这 ...

  9. Array 遍历数组

    public static void main(String args){ int a[][] = new int[3][4]; for(int i=0;i<a.length;i++){ for ...

  10. VS PDB文件

    转 PDB文件 PDB(Program Data Base),意即程序的基本数据,是VS编译链接时生成的文件.DPB文件主要存储了VS调试程序时所需要的基本信息,主要包括源文件名.变量名.函数名.FP ...