vue-select-tu

一款基于vue的多元图形选择插件

Security
Install
Usage
Maintainers
Contributing
License

Security

Install

npm install vue-select-tu

Module

import vueSelectTu from 'vue-select-tu'
Vue.use(vueSelectTu)

Usage

<vue-select-tu v-model="select":require="true":multiple="true"@change="changeData":imgData="imgData":label="yourlabel"></vue-select-tu>

Definition

Props	Description	Type	Dafult
:multiple	支持多选,默认false	Boolean	false
:imgData	数据源;默认	Array	[]
v-model/:model	图片默认选定值	Array	[“value”],默认选中第一个图片
:require	是否为必选	Boolean	false
:label	表单元素名称	String	“”
:width	图片宽度单位:px	String	“150”,图片默认150px；
:height	图片高度单位:px	String	“100”,图片默认100px；
v-on:change	选中图片回调methods	method	Function(val) {}

Example

<template><div id="app"><vue-select-tu v-model="select":require="true":multiple="true"@change="changeData":imgData="imgData"label="请选择图片:"></vue-select-tu></div>
</template>

<script>
export default {name: 'app',data() {return {select: ['1'],imgData: [{name: '流动星空',value: '1',url:'https://images.unsplash.com/photo-1436891620584-47fd0e565afb?ixid=MXwxMjA3fDB8MHxzZWFyY2h8MTV8fHN0YXJ8ZW58MHx8MHw%3D&ixlib=rb-1.2.1&auto=format&fit=crop&w=500&q=60',alt: '标签1'},{name: '深海蔚蓝',value: '2',url:'https://images.unsplash.com/photo-1505118380757-91f5f5632de0?ixid=MXwxMjA3fDB8MHxzZWFyY2h8Mnx8c2VhfGVufDB8fDB8&ixlib=rb-1.2.1&auto=format&fit=crop&w=500&q=60',alt: '标签2'},{name: '黑色商务',value: '3',url:'https://images.unsplash.com/photo-1486406146926-c627a92ad1ab?ixid=MXwxMjA3fDB8MHxzZWFyY2h8OXx8YnVzaW5lc3N8ZW58MHx8MHw%3D&ixlib=rb-1.2.1&auto=format&fit=crop&w=500&q=60',alt: '标签3'}]}},methods: {// val 为数组changeData(val) {console.log(val)}}
}
</script>

Affirm

demo中部分图片引自网络，如有雷同，请联系本人删除

WeChat: 735568868

Maintainers

@Kyle

Contributing

Small note: If editing the README, please conform to the standard-readme specification.

License

vue-select-tu--一款基于vue的多元图形选择插件相关推荐

vue 音乐盒app_VBox 一款基于vue开发的音乐盒序章
自己基于vue写了一个 Mplayer, 只有简单的搜索播放随心听功能,样式适配上也很差, 路由就两个,数据都走vuex,数据转发是用nodejs自己转发,而且只是PC能比较好的展现,之后不了了之,偶 ...
vue-color-picker-sheldon使用说明（一款基于Vue的取色器/颜色选择器）
vue-color-picker-sheldon使用说明(一款基于Vue的取色器/颜色选择器) Introduction 简介 Functions 功能点 Install 安装 Usage 用法 CS ...
el-color-picker-sheldon使用说明（一款基于Vue和ElementUI的取色器）
el-color-picker-sheldon使用说明(一款基于Vue和ElementUI的取色器) Introduction 简介 Functions 功能点 Install 安装 Usage 用法 ...
推荐一款基于Vue的开源智慧物业解决方案项目源码
项目介绍「e家宜业」是一整套基于AGPL开源协议开源的智慧物业解决方案.实现了微信公众号.小程序.PC.H5.智能硬件多端打通,旨在提升物业公司效率.规范物业服务流程.提升物业服务满意度.加强小区智 ...
一款基于VUE的在线绘制流程图工具安装使用node.js
1.安装node.js 下载地址:https://nodejs.org/en/download/ 安装一下三项,并检查是否成功: node -v npm -v vue -V(大写的V) 一款基于VUE ...
Unity数据可视化图表插件XCharts（一款基于UGUI的数据可视化图表插件）
一.前言今天,我在GitHub上看到一个屌炸天的Unity插件:XCharts,,XCharts插件是一款基于Unity3D的UGUI系统的插件,可以绘制折线图.曲线图.饼状图.雷达图.散点图.热力 ...
开发新项目看过来，这3款基于 Vue 的免费开源的 admin 管理后台框架非常好用
三款 admin 框架,分别基于热门的前端 UI 组件库 ElementPlus / Ant Design / Naive UI 打造,开箱即用. 新项目的开始,一般是搭建 admin 系统,今天盘点 ...
一款基于VUE的动态化弹出层插件
public-layer 官网 link. 这是一个基于 vue 的动态弹框插件它对标的是layer.js,和layer不同的是: 1.它零依赖不需要Jquery支持 2.它支持vue,却不限于vu ...
基于vue2.0打造移动商城页面实践 vue实现商城购物车功能基于Vue、Vuex、Vue-router实现的购物商城(原生切换动画)效果...
基于vue2.0打造移动商城页面实践地址:https://www.jianshu.com/p/2129bc4d40e9 vue实现商城购物车功能地址:http://www.jb51.net/art ...

vue-select-tu--一款基于vue的多元图形选择插件

vue-select-tu

Table of Contents

Security

Install

Module

Usage

Definition

Example

Affirm

Maintainers

Contributing

License

vue-select-tu--一款基于vue的多元图形选择插件相关推荐

最新文章

热门文章