vue.js实现含搜索的多种复选框(附源码)
作者:lemon678 发布时间:2024-05-13 09:11:00
标签:vue.js,复选框,搜索
前言
最近在重构一个复选框组件,原型是select2这个jQuery插件, 有兴趣的可以去搜下,封装的很好,但是并不能满足业务所有需求,最要命的是jquery插件这种以dom驱动数据的库,并不能和vue和angular这种数据驱动dom的框架很好的结合,所以我用vue的component重构了一下,走了不少弯路,做的demo分享出来,还请大家指点一二!
download地址:vue_select2(aspxhome.com).rar
效果图如下,封装的应该是蛮抽象的了,只需要传入下拉框选项list,默认选中list,和回调callback三个参数可以了,在这里特别说明下父与子是如何通信的,因为这里走了不少弯路!!
父级往子组件传递数据,通过v-bind绑定数据,子组件接收props里的数据,通过watch监听数据改变。
子组件往父级传递数据,通过$dispatch派发,绑定到自定义的selected或inputed事件,再触发父级的回调。
来源:http://blog.csdn.net/lemon_zhao/article/details/53513766
0
投稿
猜你喜欢
- 有时候需要对有角度的矩形框内图像从原图片中分割出来。这里的程序思想是,先将图片进行矩形角度的旋转,使有角度的矩形处于水平状态后,根据原来坐标
- 简介在各个语言之中都有时间类型的处理,因为这个地球是圆的(我仿佛在讲废话),有多个时区,每个时区的时间不一样,在程序中有必要存在一种方式,或
- 我就废话不多说了,直接上代码吧!import urllib.requestimport requestsimport timeimport
- 大家都知道很多控件是没有clicked信号的,我在网上找了很多终于总结出2个方法来实现类似需求,比如给QLineEdit添加clicked信
- GitHub 可谓各种神器都有,今天发现一个操作数据库的命令行工具,可以自动补全和语法高亮,以前在终端敲 SQL 的时候,你不仅要记住表名、
- 如何用POP3接收电子邮件?POP3大行其道,我看见朋友已经用Jmail和POP3接收邮件了。该如何做?以Jmail4.1为例,我们演示一下
- 本文以实例形式讲述了Python中切片操作的用法,分享给大家供大家参考借鉴,具体如下:取一个list或tuple的部分元素是非常常见的操作。
- 一、要求二、思路1.购物类buy接收 信用卡类 的信用卡可用可用余额,返回消费金额2.信用卡(ATM)类接收上次操作后,信用卡可用余额,总欠
- 本文主要给大家介绍了关于python实现循环购物车功能的相关内容,分享出来供大家参考学习,下面来一起看看详细的介绍:示例代码# -*- co
- MySQL服务器有几个影响其操作的参数(变量)。如果缺省的参数值不合适,可以将其修改为对服务器运行环境更合适的值。例如,如果您有大量的内存,
- 引言python的一个优势是有着大量自带和在线的模块(module)资源,可以提供丰富的功能,在使用这些模块的时候,如果每次都去网站找在线文
- 前言:1.前面基于Springboot的单体项目介绍已经完结了,至于项目中的其他功能实现我这里就不打算介绍了,因为涉及的知识点不难,而且都是
- package work;import java.io.BufferedReader;import java.io.IOException;
- 内容介绍以 Python 使用 关联规则 简单举例应用关联规则分析。关联规则 也被称为购物篮分析,用于分析数据集各项之间的关联关系。一般应用
- 本文实例讲述了Python实现模拟分割大文件及多线程处理的方法。分享给大家供大家参考,具体如下:#!/usr/bin/env python#
- 训练好了model后,可以通过python调用caffe的模型,然后进行模型测试的输出。本次测试主要依靠的模型是在caffe模型里面自带训练
- 下面的代码使用正则表达式验证输入格式包括了验证邮箱和验证手机号码package com.firewolf.utils;import java
- python代码生成API接口如果要将我们写好的Python代码生成API接口时,我们需要借助Flask框架1. 安装Flaskpip in
- 前段时间发表了一个删除栏目的随笔,当时实现的功能是删除一条信息,这次来实现一下批量删除栏目。我们需要达到的是这样一个效果:选中批量删除按钮后
- 安装pip install websocket-client先来看一下,长连接调用方式:ws = websocket.WebSocketAp