iice-vue v1.0.15
iice-vue
Vue components
Install
npm i iice-vue
iice-dialogsuccess iice-dialogconfirm iice-dialogwarning iice-fileselector iice-inputsuggest iice-multiselector iice-pagination iice-dropdownsearch iice-tagsinput iice-textarearows iice-treeview iice-treedropdown
iice-dialogsuccess
Vue
import { iice_dialogsuccess } from 'iice-vue'
Props
v-model: { type: Boolean, default: false } ** หากเป็น true แสดง dialog 3 วินาที หากเป็น false ซ่อน dialog
message: { type: String, default: "Saved successfully" } ** ข้อความสำหรับแสดงใน dialog
iice-dialogconfirm
Vue
import { iice_dialogconfirm } from 'iice-vue'
Props
v-model: { type: Boolean, default: false } ** หากเป็น true แสดง dialog หากเป็น false ซ่อน dialog
message: { type: String, default: "" } ** ข้อความสำหรับแสดงใน dialog
Events
confirm ** กดปุ่มยืนยัน
iice-dialogwarning
Vue
import { iice_dialogwarning } from 'iice-vue'
Props
v-model: { type: Boolean, default: false } ** หากเป็น true แสดง dialog หากเป็น false ซ่อน dialog
message: { type: String, default: "" } ** ข้อความสำหรับแสดงใน dialog
iice-fileselector
Vue
import { iice_fileselector } from 'iice-vue'
Props
v-model: { type: FileList, default: () => [] }, ** ไฟล์ทั้งหมด
caption: { type: String, default: "เลือกไฟล์" }, ** ข้อความ
accept: { type: String, default: "" }, * ประเภทไฟล์ เช่น video/, image/png, image/jpeg
multiple: { type: Boolean, default: false }, ** เลือกได้หลายไฟล์หรือไม่
maxsize: { type: Number, default: 0 } ** ขนาดไฟล์สูงสุด
iice-inputsuggest
Vue
import { iice_inputsuggest } from 'iice-vue'
Props
min: { type: Number, min: 1 }, ** จำนวนตัวอักษรน้อยที่สุด
max: { type: Number, default: 200 }, ** จำนวนตัวอักษรมากที่สุด
placeholder: { type: String, Number }, ** คำแนะนำ
list: { type: Array, default: () => [] }, ** รายการคำแนะนำ
v-model: { type: String, Number, default: "" }, ** คำที่ได้จากการคีย์คำใหม่หรือเลือกจากรายการแนะนำ
iice-multiselector
Vue
import { iice_multiselector } from 'iice-vue'
Props
v-model: { type: Array, default: () => [] }, ** ค่าของทุกรายการที่เลือก
sourceList: { type: Array, default: () => [] }, ** รายการที่เลือกได้ อยู่ในรูปแบบ { value: "", text: "" }
valueField: { type: String, required: true }, ** ชื่อฟิลล์สำหรับระบุค่า
displayField: { type: String, required: true } ** ชื่อฟิลล์สำหรับแสดงผล
iice-pagination
Vue
import { iice_pagination } from 'iice-vue'
Props
v-model: { type: Number, default: 1 }, ** เลขหน้า
totalPage: { type: Number, default: 1 }, ** จำนวนหน้าทั้งหมด
showPage: { type: Number, default: 10 } ** จำนวนหน้าที่แสดงตัวเลข หน้ารอบข้างแสดงเป็น "..."
iice-dropdownsearch
Vue
import { iice_dropdownsearch } from 'iice-vue'
Props
v-model: { type: String, default: "" }, ** ค่าของทุกรายการที่เลือก
sourceList: { type: Array, default: () => [] }, ** รายการที่เลือกได้ อยู่ในรูปแบบ { value: "", text: "" }
valueField: { type: String, required: true }, ** ชื่อฟิลล์สำหรับระบุค่า
displayField: { type: String, required: true } ** ชื่อฟิลล์สำหรับแสดงผล
iice-tagsinput
Vue
import { iice_tagsinput } from 'iice-vue'
Props
min: { type: Number, min: 1 }, ** จำนวนตัวอักษรน้อยที่สุด
max: { type: Number, default: 200 }, ** จำนวนตัวอักษรมากที่สุด
placeholder: { type: String, Number }, ** คำแนะนำ
list: { type: Array, default: () => [] }, ** รายการคำแนะนำ
v-model: { type: Array, default: () => [] }, ** คำที่ได้จากการคีย์คำใหม่หรือเลือกจากรายการแนะนำ
iice-textarearows
Vue
import { iice_textarearows } from 'iice-vue'
Props
v-model: { type: String, default: "", }, ** ค่าของ input
rows: { type: Number, String, default: 3 } ** จำนวนแถวเริ่มต้น
Note
กรณีที่ textarearows ไม่ได้แสดงทันทีเช่น อยู่ในแท็บที่ 2 ตอนเลือกแท็บที่ 2 ให้ใส่โค๊ดตามนี้ const customEvent = new Event("resize", { "bubbles": true, "cancelable": false }); document.dispatchEvent(customEvent);
iice-treeview
Vue
import { iice_treeview } from 'iice-vue'
Props
sourceList: { type: Array, default: () => [] }, ** รายการที่เลือกได้ อยู่ในรูปแบบ { label: "", value: "", expand: false, checked: 0, children: [] }
Events
checkChange ส่งค่ารายการที่เลือกเป็น Array of String.
iice-treedropdown
Vue
import { iice_treedropdown } from 'iice-vue'
Props
sourceList: { type: Array, default: () => [] }, ** รายการที่เลือกได้ อยู่ในรูปแบบ { label: "", value: "", expand: false, checked: 0, children: [] }
Events
valueChange ส่งค่ารายการที่เลือกเป็น Array of String.
8 months ago
8 months ago
8 months ago
8 months ago
8 months ago
8 months ago
8 months ago
8 months ago
8 months ago
8 months ago
8 months ago
8 months ago
8 months ago
8 months ago
8 months ago
8 months ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago