更新记录

1.1.11（2020-07-23）

select和multi-select支持“其它选项”

1.1.10（2020-05-09）

车牌号输入样式修改

1.1.9（2020-05-06）

外国选择

除中国以外的国家选择

当前位置

获取包括当前中文地理名称（精确到市）、经纬度坐标、IP地址

车牌号输入

输入车牌号（蓝色旧牌照、绿色新牌照、橙色输入错误）

平台兼容性

综述

1. 本项目支持添加：单选、多选、是否、单行输入、多行输入、级别输入、日期、时间、省市区三联、图片、行业/大学二级联动、手机号+验证码、用户自定义单列选择器、密码输入、外国选择、当地地理位置、车牌号输入的问卷题目格式
   
2. 本项目的省市区三级联动为JSON数据《中国省市区json数据 三级联动》 璎Nicole珞 博客园 并未采用<picker mode='region'></picker>所以可能出现更新不及时的问题
   
3. 本项目的行业选择器行业划分参考国家行业划分标准：GB-4754-2017（<wenjuan mode='work'></wenjuan>）
4. 本项目手机号+验证码仅为前端，不包括后端服务器也不包括阿里云短信服务（<wenjuan mode='phone'></wenjuan>）
5. 本项目的大学选择器为JSON数据来源：包子源 CSDN，为“区域”-“大学名称”（<wenjuan mode='university'></wenjuan>）

组件属性

类型样例

调用格式

<wenjuan type='example' 
         title='example' 
         subTitle='example' 
         :value='array' 
         :defaultValue='array/string' 
         :maxSelect='number' 
         :hasOther='boolean'
         @change='function'
         @sendCode='function: only when type=phone'
></wenjuan>

主要属性

上述类型分别对应如下属性：

type

必填题目类型

• 'multi-select' 复选选择题
• 'select' 单选选择题
• 'input' 单行文本输入
• 'textarea' 多行文本输入
• 'level' 等级选择题
• 'boolean' 是非选择题
• 'date' 日期选择器
• 'time' 时间选择器
• 'region' 省市区三联选择器
• 'image' 图片选择器
• 'phone' 手机输入+验证码
• 'work' 行业二级联动选择器
• 'university' 大学二级联动选择器
• 'single-picker' 自定义单列选择器
• 'password' 密码输入
• 'foreign' 外国国家选取
• 'local' 获取当前位置信息
• 'drive' 车牌号输入

分题目类型属性说明

共有的属性

复选 multi-select

单选 select

判断 boolean

数值 level

单行输入 input

多行输入 textarea

日期选择 date

时间选择器 time

地区选择器 region

可排序图片选择器 image

前端手机+验证码输入 phone

行业选择器 work

大学选择器 university

自定义单列选择器 single-picker

密码输入 password

外国过国家选取 foreign

当前位置信息 local

特殊的：当type=local时，$event将返回3个信息：当前中文地理名称、经纬度、ip地址

车牌号输入 drive

方法

change

用于获取更改选项等参数，支持change($event,...其他参数)获取方式，其中$event返回一个数组

sendCode

用于监听验证码发送按钮点击事件，支持sendCode($event,...其他参数)获取方式，其中$event返回一个数组[phone,code]

样式

调用本组件可以用scoped穿透：
比如：

//你的功能也定义样式如下：可以修改问题题目的样式：color
//wenjuan-view就是您自己给问卷<wenjuan class="wenjuan-view" />的样式
<style>
  .wenjuan-view >>> .title{
      color: #123456;
  }
</style>

.title

负责设置问卷标题样式

.subTitle

负责这只问卷副标题样式

.borderGrey

负责设置问卷完成的下方的下划线

.sliderInput

负责设置级别输入下方输入框样式

.xuanxiang

负责设置选项文字的样式

input

负责设置输入框样式

textarea

负责设置多行输入框样式

.datePicker

负责picker样式：日期、时间、省市区三级联动、行业二级选择器、外国、车牌、自定义单列、大学

.imageContainer

负责图片外框样式

.imageBlock

负责图片样式

.phone

负责电话号码输入框的样式

.code

负责验证码输入框的样式

.sendButton

负责发送短信验证码按钮的样式

.bg-green

负责发送短信验证码按钮可用时样式

.bg-white

发送短信验证码按钮不可用（倒计时）的样式

关于事例项目

list页面

list 页面展示的是通过 data设置一整张问卷的情形

index页面

index 页面所展示的是 单独使用wenjuan的情形

特殊的

致歉

本项目暂时无法对用户的行为（包括必须非空、异常值处理）做出相应约束，请有需要的用户在自己前端提交时自行对所提交的数据进行校验