forked from didi/cube-ui
-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy path63.ff8c7bca19e17a670dda.js
1 lines (1 loc) · 44.6 KB
/
63.ff8c7bca19e17a670dda.js
1
webpackJsonp([63],{"4+v0":function(s,t,a){var v=a("VU/8")(null,a("DMGn"),null,null,null);s.exports=v.exports},DMGn:function(s,t){s.exports={render:function(){var s=this,t=s.$createElement,a=s._self._c||t;return a("section",[a("h2",{attrs:{id:"Form"}},[a("a",{staticClass:"anchor",attrs:{href:"#cube-Form-anchor","aria-hidden":"true"}},[a("svg",{attrs:{"aria-hidden":"true",height:"16",version:"1.1",viewBox:"0 0 16 16",width:"16"}},[a("path",{attrs:{"fill-rule":"evenodd",d:"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"}})])]),s._v(" Form")]),s._v(" "),a("p",[s._v("CubeForm is a schema-based form generator component.")]),s._v(" "),a("h3",{attrs:{id:"Example"}},[a("a",{staticClass:"anchor",attrs:{href:"#cube-Example-anchor","aria-hidden":"true"}},[a("svg",{attrs:{"aria-hidden":"true",height:"16",version:"1.1",viewBox:"0 0 16 16",width:"16"}},[a("path",{attrs:{"fill-rule":"evenodd",d:"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"}})])]),s._v(" Example")]),s._v(" "),s._m(0),s._v(" "),a("h3",{attrs:{id:"Props"}},[a("a",{staticClass:"anchor",attrs:{href:"#cube-Props-anchor","aria-hidden":"true"}},[a("svg",{attrs:{"aria-hidden":"true",height:"16",version:"1.1",viewBox:"0 0 16 16",width:"16"}},[a("path",{attrs:{"fill-rule":"evenodd",d:"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"}})])]),s._v(" Props")]),s._v(" "),a("h4",{attrs:{id:"Form"}},[a("a",{staticClass:"anchor",attrs:{href:"#cube-Form-anchor","aria-hidden":"true"}},[a("svg",{attrs:{"aria-hidden":"true",height:"16",version:"1.1",viewBox:"0 0 16 16",width:"16"}},[a("path",{attrs:{"fill-rule":"evenodd",d:"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"}})])]),s._v(" Form")]),s._v(" "),s._m(1),s._v(" "),s._m(2),s._v(" "),a("h4",{attrs:{id:"FormGroup"}},[a("a",{staticClass:"anchor",attrs:{href:"#cube-FormGroup-anchor","aria-hidden":"true"}},[a("svg",{attrs:{"aria-hidden":"true",height:"16",version:"1.1",viewBox:"0 0 16 16",width:"16"}},[a("path",{attrs:{"fill-rule":"evenodd",d:"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"}})])]),s._v(" FormGroup")]),s._v(" "),s._m(3),s._v(" "),a("h4",{attrs:{id:"FormItem"}},[a("a",{staticClass:"anchor",attrs:{href:"#cube-FormItem-anchor","aria-hidden":"true"}},[a("svg",{attrs:{"aria-hidden":"true",height:"16",version:"1.1",viewBox:"0 0 16 16",width:"16"}},[a("path",{attrs:{"fill-rule":"evenodd",d:"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"}})])]),s._v(" FormItem")]),s._v(" "),s._m(4),s._v(" "),a("h3",{attrs:{id:"Events"}},[a("a",{staticClass:"anchor",attrs:{href:"#cube-Events-anchor","aria-hidden":"true"}},[a("svg",{attrs:{"aria-hidden":"true",height:"16",version:"1.1",viewBox:"0 0 16 16",width:"16"}},[a("path",{attrs:{"fill-rule":"evenodd",d:"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"}})])]),s._v(" Events")]),s._v(" "),s._m(5),s._v(" "),s._m(6),s._v(" "),a("h3",{attrs:{id:"Instancemethods"}},[a("a",{staticClass:"anchor",attrs:{href:"#cube-Instancemethods-anchor","aria-hidden":"true"}},[a("svg",{attrs:{"aria-hidden":"true",height:"16",version:"1.1",viewBox:"0 0 16 16",width:"16"}},[a("path",{attrs:{"fill-rule":"evenodd",d:"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"}})])]),s._v(" Instance methods")]),s._v(" "),s._m(7)])},staticRenderFns:[function(){var s=this,t=s.$createElement,a=s._self._c||t;return a("ul",[a("li",[a("p",[s._v("default usage")]),s._v(" "),a("p",[s._v("This demo includes all cube-ui form fields.")]),s._v(" "),a("pre",{pre:!0},[a("code",{attrs:{"v-pre":"",class:"language-html"}},[a("span",{attrs:{class:"hljs-tag"}},[s._v("<"),a("span",{attrs:{class:"hljs-name"}},[s._v("cube-form")]),s._v("\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v(":model")]),s._v("="),a("span",{attrs:{class:"hljs-string"}},[s._v('"model"')]),s._v("\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v(":schema")]),s._v("="),a("span",{attrs:{class:"hljs-string"}},[s._v('"schema"')]),s._v("\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v(":immediate-validate")]),s._v("="),a("span",{attrs:{class:"hljs-string"}},[s._v('"true"')]),s._v("\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v(":options")]),s._v("="),a("span",{attrs:{class:"hljs-string"}},[s._v('"options"')]),s._v("\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("@validate")]),s._v("="),a("span",{attrs:{class:"hljs-string"}},[s._v('"validateHandler"')]),s._v("\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("@submit")]),s._v("="),a("span",{attrs:{class:"hljs-string"}},[s._v('"submitHandler"')]),s._v("\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("@reset")]),s._v("="),a("span",{attrs:{class:"hljs-string"}},[s._v('"resetHandler"')]),s._v(">")]),a("span",{attrs:{class:"hljs-tag"}},[s._v("</"),a("span",{attrs:{class:"hljs-name"}},[s._v("cube-form")]),s._v(">")]),s._v("\n")])]),s._v(" "),a("pre",{pre:!0},[a("code",{attrs:{"v-pre":"",class:"language-js"}},[a("span",{attrs:{class:"hljs-keyword"}},[s._v("export")]),s._v(" "),a("span",{attrs:{class:"hljs-keyword"}},[s._v("default")]),s._v(" {\n data() {\n "),a("span",{attrs:{class:"hljs-keyword"}},[s._v("return")]),s._v(" {\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("validity")]),s._v(": {},\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("valid")]),s._v(": "),a("span",{attrs:{class:"hljs-literal"}},[s._v("undefined")]),s._v(",\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("model")]),s._v(": {\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("checkboxValue")]),s._v(": "),a("span",{attrs:{class:"hljs-literal"}},[s._v("false")]),s._v(",\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("checkboxGroupValue")]),s._v(": [],\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("inputValue")]),s._v(": "),a("span",{attrs:{class:"hljs-string"}},[s._v("''")]),s._v(",\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("radioValue")]),s._v(": "),a("span",{attrs:{class:"hljs-string"}},[s._v("''")]),s._v(",\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("rateValue")]),s._v(": "),a("span",{attrs:{class:"hljs-number"}},[s._v("0")]),s._v(",\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("selectValue")]),s._v(": "),a("span",{attrs:{class:"hljs-number"}},[s._v("2018")]),s._v(",\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("switchValue")]),s._v(": "),a("span",{attrs:{class:"hljs-literal"}},[s._v("true")]),s._v(",\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("textareaValue")]),s._v(": "),a("span",{attrs:{class:"hljs-string"}},[s._v("''")]),s._v(",\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("uploadValue")]),s._v(": []\n },\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("schema")]),s._v(": {\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("groups")]),s._v(": [\n {\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("legend")]),s._v(": "),a("span",{attrs:{class:"hljs-string"}},[s._v("'基础'")]),s._v(",\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("fields")]),s._v(": [\n {\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("type")]),s._v(": "),a("span",{attrs:{class:"hljs-string"}},[s._v("'checkbox'")]),s._v(",\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("modelKey")]),s._v(": "),a("span",{attrs:{class:"hljs-string"}},[s._v("'checkboxValue'")]),s._v(",\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("props")]),s._v(": {\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("option")]),s._v(": {\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("label")]),s._v(": "),a("span",{attrs:{class:"hljs-string"}},[s._v("'Checkbox'")]),s._v(",\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("value")]),s._v(": "),a("span",{attrs:{class:"hljs-literal"}},[s._v("true")]),s._v("\n }\n },\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("rules")]),s._v(": {\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("required")]),s._v(": "),a("span",{attrs:{class:"hljs-literal"}},[s._v("true")]),s._v("\n },\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("messages")]),s._v(": {\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("required")]),s._v(": "),a("span",{attrs:{class:"hljs-string"}},[s._v("'Please check this field'")]),s._v("\n }\n },\n {\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("type")]),s._v(": "),a("span",{attrs:{class:"hljs-string"}},[s._v("'checkbox-group'")]),s._v(",\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("modelKey")]),s._v(": "),a("span",{attrs:{class:"hljs-string"}},[s._v("'checkboxGroupValue'")]),s._v(",\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("label")]),s._v(": "),a("span",{attrs:{class:"hljs-string"}},[s._v("'CheckboxGroup'")]),s._v(",\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("props")]),s._v(": {\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("options")]),s._v(": ["),a("span",{attrs:{class:"hljs-string"}},[s._v("'1'")]),s._v(", "),a("span",{attrs:{class:"hljs-string"}},[s._v("'2'")]),s._v(", "),a("span",{attrs:{class:"hljs-string"}},[s._v("'3'")]),s._v("]\n },\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("rules")]),s._v(": {\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("required")]),s._v(": "),a("span",{attrs:{class:"hljs-literal"}},[s._v("true")]),s._v("\n }\n },\n {\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("type")]),s._v(": "),a("span",{attrs:{class:"hljs-string"}},[s._v("'input'")]),s._v(",\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("modelKey")]),s._v(": "),a("span",{attrs:{class:"hljs-string"}},[s._v("'inputValue'")]),s._v(",\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("label")]),s._v(": "),a("span",{attrs:{class:"hljs-string"}},[s._v("'Input'")]),s._v(",\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("props")]),s._v(": {\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("placeholder")]),s._v(": "),a("span",{attrs:{class:"hljs-string"}},[s._v("'请输入'")]),s._v("\n },\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("rules")]),s._v(": {\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("required")]),s._v(": "),a("span",{attrs:{class:"hljs-literal"}},[s._v("true")]),s._v("\n }\n },\n {\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("type")]),s._v(": "),a("span",{attrs:{class:"hljs-string"}},[s._v("'radio-group'")]),s._v(",\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("modelKey")]),s._v(": "),a("span",{attrs:{class:"hljs-string"}},[s._v("'radioValue'")]),s._v(",\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("label")]),s._v(": "),a("span",{attrs:{class:"hljs-string"}},[s._v("'Radio'")]),s._v(",\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("props")]),s._v(": {\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("options")]),s._v(": ["),a("span",{attrs:{class:"hljs-string"}},[s._v("'1'")]),s._v(", "),a("span",{attrs:{class:"hljs-string"}},[s._v("'2'")]),s._v(", "),a("span",{attrs:{class:"hljs-string"}},[s._v("'3'")]),s._v("]\n },\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("rules")]),s._v(": {\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("required")]),s._v(": "),a("span",{attrs:{class:"hljs-literal"}},[s._v("true")]),s._v("\n }\n },\n {\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("type")]),s._v(": "),a("span",{attrs:{class:"hljs-string"}},[s._v("'select'")]),s._v(",\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("modelKey")]),s._v(": "),a("span",{attrs:{class:"hljs-string"}},[s._v("'selectValue'")]),s._v(",\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("label")]),s._v(": "),a("span",{attrs:{class:"hljs-string"}},[s._v("'Select'")]),s._v(",\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("props")]),s._v(": {\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("options")]),s._v(": ["),a("span",{attrs:{class:"hljs-number"}},[s._v("2015")]),s._v(", "),a("span",{attrs:{class:"hljs-number"}},[s._v("2016")]),s._v(", "),a("span",{attrs:{class:"hljs-number"}},[s._v("2017")]),s._v(", "),a("span",{attrs:{class:"hljs-number"}},[s._v("2018")]),s._v(", "),a("span",{attrs:{class:"hljs-number"}},[s._v("2019")]),s._v(", "),a("span",{attrs:{class:"hljs-number"}},[s._v("2020")]),s._v("]\n },\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("rules")]),s._v(": {\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("required")]),s._v(": "),a("span",{attrs:{class:"hljs-literal"}},[s._v("true")]),s._v("\n }\n },\n {\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("type")]),s._v(": "),a("span",{attrs:{class:"hljs-string"}},[s._v("'switch'")]),s._v(",\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("modelKey")]),s._v(": "),a("span",{attrs:{class:"hljs-string"}},[s._v("'switchValue'")]),s._v(",\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("label")]),s._v(": "),a("span",{attrs:{class:"hljs-string"}},[s._v("'Switch'")]),s._v(",\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("rules")]),s._v(": {\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("required")]),s._v(": "),a("span",{attrs:{class:"hljs-literal"}},[s._v("true")]),s._v("\n }\n },\n {\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("type")]),s._v(": "),a("span",{attrs:{class:"hljs-string"}},[s._v("'textarea'")]),s._v(",\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("modelKey")]),s._v(": "),a("span",{attrs:{class:"hljs-string"}},[s._v("'textareaValue'")]),s._v(",\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("label")]),s._v(": "),a("span",{attrs:{class:"hljs-string"}},[s._v("'Textarea'")]),s._v(",\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("rules")]),s._v(": {\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("required")]),s._v(": "),a("span",{attrs:{class:"hljs-literal"}},[s._v("true")]),s._v("\n }\n }\n ]\n },\n {\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("legend")]),s._v(": "),a("span",{attrs:{class:"hljs-string"}},[s._v("'高级'")]),s._v(",\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("fields")]),s._v(": [\n {\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("type")]),s._v(": "),a("span",{attrs:{class:"hljs-string"}},[s._v("'rate'")]),s._v(",\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("modelKey")]),s._v(": "),a("span",{attrs:{class:"hljs-string"}},[s._v("'rateValue'")]),s._v(",\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("label")]),s._v(": "),a("span",{attrs:{class:"hljs-string"}},[s._v("'Rate'")]),s._v(",\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("rules")]),s._v(": {\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("required")]),s._v(": "),a("span",{attrs:{class:"hljs-literal"}},[s._v("true")]),s._v("\n }\n },\n {\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("type")]),s._v(": "),a("span",{attrs:{class:"hljs-string"}},[s._v("'upload'")]),s._v(",\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("modelKey")]),s._v(": "),a("span",{attrs:{class:"hljs-string"}},[s._v("'uploadValue'")]),s._v(",\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("label")]),s._v(": "),a("span",{attrs:{class:"hljs-string"}},[s._v("'Upload'")]),s._v(",\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("rules")]),s._v(": {\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("required")]),s._v(": "),a("span",{attrs:{class:"hljs-literal"}},[s._v("true")]),s._v("\n }\n }\n ]\n },\n {\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("fields")]),s._v(": [\n {\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("type")]),s._v(": "),a("span",{attrs:{class:"hljs-string"}},[s._v("'submit'")]),s._v(",\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("label")]),s._v(": "),a("span",{attrs:{class:"hljs-string"}},[s._v("'Submit'")]),s._v("\n },\n {\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("type")]),s._v(": "),a("span",{attrs:{class:"hljs-string"}},[s._v("'reset'")]),s._v(",\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("label")]),s._v(": "),a("span",{attrs:{class:"hljs-string"}},[s._v("'Reset'")]),s._v("\n }\n ]\n }\n ]\n },\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("options")]),s._v(": {\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("scrollToInvalidField")]),s._v(": "),a("span",{attrs:{class:"hljs-literal"}},[s._v("true")]),s._v("\n }\n }\n },\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("methods")]),s._v(": {\n submitHandler(e) {\n e.preventDefault()\n "),a("span",{attrs:{class:"hljs-built_in"}},[s._v("console")]),s._v(".log("),a("span",{attrs:{class:"hljs-string"}},[s._v("'submit'")]),s._v(", e)\n },\n validateHandler(result) {\n "),a("span",{attrs:{class:"hljs-keyword"}},[s._v("this")]),s._v(".validity = result.validity\n "),a("span",{attrs:{class:"hljs-keyword"}},[s._v("this")]),s._v(".valid = result.valid\n "),a("span",{attrs:{class:"hljs-built_in"}},[s._v("console")]),s._v(".log("),a("span",{attrs:{class:"hljs-string"}},[s._v("'validity'")]),s._v(", result.validity, result.valid, result.dirty, result.firstInvalidFieldIndex)\n },\n resetHandler(e) {\n "),a("span",{attrs:{class:"hljs-built_in"}},[s._v("console")]),s._v(".log("),a("span",{attrs:{class:"hljs-string"}},[s._v("'reset'")]),s._v(", e)\n }\n }\n}\n")])]),s._v(" "),a("p",[a("code",{pre:!0},[s._v("model")]),s._v(" is the model/target JSON object, "),a("code",{pre:!0},[s._v("schema")]),s._v(" is the schema object with fields, if "),a("code",{pre:!0},[s._v("immediate-validate")]),s._v(" is true, we will run validation after load.")]),s._v(" "),a("p",[a("code",{pre:!0},[s._v("submit")]),s._v(" is the submited event, the "),a("code",{pre:!0},[s._v("validate")]),s._v(" is the form validate event and the "),a("code",{pre:!0},[s._v("reset")]),s._v(" is the form reset event.")])]),s._v(" "),a("li",[a("p",[s._v("Custom usage")]),s._v(" "),a("p",[s._v("You can choose to use your own custom components, or use slots to custom your logic.")]),s._v(" "),a("pre",{pre:!0},[a("code",{attrs:{"v-pre":"",class:"language-html"}},[a("span",{attrs:{class:"hljs-tag"}},[s._v("<"),a("span",{attrs:{class:"hljs-name"}},[s._v("cube-form")]),s._v(" "),a("span",{attrs:{class:"hljs-attr"}},[s._v(":model")]),s._v("="),a("span",{attrs:{class:"hljs-string"}},[s._v('"model"')]),s._v(" "),a("span",{attrs:{class:"hljs-attr"}},[s._v("@validate")]),s._v("="),a("span",{attrs:{class:"hljs-string"}},[s._v('"validateHandler"')]),s._v(" "),a("span",{attrs:{class:"hljs-attr"}},[s._v("@submit")]),s._v("="),a("span",{attrs:{class:"hljs-string"}},[s._v('"submitHandler"')]),s._v(">")]),s._v("\n "),a("span",{attrs:{class:"hljs-tag"}},[s._v("<"),a("span",{attrs:{class:"hljs-name"}},[s._v("cube-form-group")]),s._v(">")]),s._v("\n "),a("span",{attrs:{class:"hljs-tag"}},[s._v("<"),a("span",{attrs:{class:"hljs-name"}},[s._v("cube-form-item")]),s._v(" "),a("span",{attrs:{class:"hljs-attr"}},[s._v(":field")]),s._v("="),a("span",{attrs:{class:"hljs-string"}},[s._v('"fields[0]"')]),s._v(">")]),a("span",{attrs:{class:"hljs-tag"}},[s._v("</"),a("span",{attrs:{class:"hljs-name"}},[s._v("cube-form-item")]),s._v(">")]),s._v("\n "),a("span",{attrs:{class:"hljs-tag"}},[s._v("<"),a("span",{attrs:{class:"hljs-name"}},[s._v("cube-form-item")]),s._v(" "),a("span",{attrs:{class:"hljs-attr"}},[s._v(":field")]),s._v("="),a("span",{attrs:{class:"hljs-string"}},[s._v('"fields[1]"')]),s._v(">")]),a("span",{attrs:{class:"hljs-tag"}},[s._v("</"),a("span",{attrs:{class:"hljs-name"}},[s._v("cube-form-item")]),s._v(">")]),s._v("\n "),a("span",{attrs:{class:"hljs-tag"}},[s._v("<"),a("span",{attrs:{class:"hljs-name"}},[s._v("cube-form-item")]),s._v(" "),a("span",{attrs:{class:"hljs-attr"}},[s._v(":field")]),s._v("="),a("span",{attrs:{class:"hljs-string"}},[s._v('"fields[2]"')]),s._v(">")]),s._v("\n "),a("span",{attrs:{class:"hljs-tag"}},[s._v("<"),a("span",{attrs:{class:"hljs-name"}},[s._v("cube-button")]),s._v(" "),a("span",{attrs:{class:"hljs-attr"}},[s._v("@click")]),s._v("="),a("span",{attrs:{class:"hljs-string"}},[s._v('"showDatePicker"')]),s._v(">")]),s._v("{{model.dateValue || 'Please select date'}}"),a("span",{attrs:{class:"hljs-tag"}},[s._v("</"),a("span",{attrs:{class:"hljs-name"}},[s._v("cube-button")]),s._v(">")]),s._v("\n "),a("span",{attrs:{class:"hljs-tag"}},[s._v("<"),a("span",{attrs:{class:"hljs-name"}},[s._v("date-picker")]),s._v(" "),a("span",{attrs:{class:"hljs-attr"}},[s._v("ref")]),s._v("="),a("span",{attrs:{class:"hljs-string"}},[s._v('"datePicker"')]),s._v(" "),a("span",{attrs:{class:"hljs-attr"}},[s._v(":min")]),s._v("="),a("span",{attrs:{class:"hljs-string"}},[s._v('"[2008, 8, 8]"')]),s._v(" "),a("span",{attrs:{class:"hljs-attr"}},[s._v(":max")]),s._v("="),a("span",{attrs:{class:"hljs-string"}},[s._v('"[2020, 10, 20]"')]),s._v(" "),a("span",{attrs:{class:"hljs-attr"}},[s._v("@select")]),s._v("="),a("span",{attrs:{class:"hljs-string"}},[s._v('"dateSelectHandler"')]),s._v(">")]),a("span",{attrs:{class:"hljs-tag"}},[s._v("</"),a("span",{attrs:{class:"hljs-name"}},[s._v("date-picker")]),s._v(">")]),s._v("\n "),a("span",{attrs:{class:"hljs-tag"}},[s._v("</"),a("span",{attrs:{class:"hljs-name"}},[s._v("cube-form-item")]),s._v(">")]),s._v("\n "),a("span",{attrs:{class:"hljs-tag"}},[s._v("</"),a("span",{attrs:{class:"hljs-name"}},[s._v("cube-form-group")]),s._v(">")]),s._v("\n "),a("span",{attrs:{class:"hljs-tag"}},[s._v("<"),a("span",{attrs:{class:"hljs-name"}},[s._v("cube-form-group")]),s._v(">")]),s._v("\n "),a("span",{attrs:{class:"hljs-tag"}},[s._v("<"),a("span",{attrs:{class:"hljs-name"}},[s._v("cube-button")]),s._v(" "),a("span",{attrs:{class:"hljs-attr"}},[s._v("type")]),s._v("="),a("span",{attrs:{class:"hljs-string"}},[s._v('"submit"')]),s._v(">")]),s._v("Submit"),a("span",{attrs:{class:"hljs-tag"}},[s._v("</"),a("span",{attrs:{class:"hljs-name"}},[s._v("cube-button")]),s._v(">")]),s._v("\n "),a("span",{attrs:{class:"hljs-tag"}},[s._v("</"),a("span",{attrs:{class:"hljs-name"}},[s._v("cube-form-group")]),s._v(">")]),s._v("\n"),a("span",{attrs:{class:"hljs-tag"}},[s._v("</"),a("span",{attrs:{class:"hljs-name"}},[s._v("cube-form")]),s._v(">")]),s._v("\n")])]),s._v(" "),a("pre",{pre:!0},[a("code",{attrs:{"v-pre":"",class:"language-js"}},[a("span",{attrs:{class:"hljs-comment"}},[s._v("// province, city, area")]),s._v("\n"),a("span",{attrs:{class:"hljs-comment"}},[s._v("// select component")]),s._v("\n"),a("span",{attrs:{class:"hljs-keyword"}},[s._v("const")]),s._v(" PCA = {\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("props")]),s._v(": {\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("value")]),s._v(": {\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("type")]),s._v(": "),a("span",{attrs:{class:"hljs-built_in"}},[s._v("Array")]),s._v(",\n "),a("span",{attrs:{class:"hljs-keyword"}},[s._v("default")]),s._v("() {\n "),a("span",{attrs:{class:"hljs-keyword"}},[s._v("return")]),s._v(" []\n }\n }\n },\n data() {\n "),a("span",{attrs:{class:"hljs-keyword"}},[s._v("return")]),s._v(" {\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("selected")]),s._v(": []\n }\n },\n render(createElement) {\n "),a("span",{attrs:{class:"hljs-keyword"}},[s._v("return")]),s._v(" createElement("),a("span",{attrs:{class:"hljs-string"}},[s._v("'cube-button'")]),s._v(", {\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("on")]),s._v(": {\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("click")]),s._v(": "),a("span",{attrs:{class:"hljs-keyword"}},[s._v("this")]),s._v(".showPicker\n }\n }, "),a("span",{attrs:{class:"hljs-keyword"}},[s._v("this")]),s._v(".selected.length ? "),a("span",{attrs:{class:"hljs-keyword"}},[s._v("this")]),s._v(".selected.join("),a("span",{attrs:{class:"hljs-string"}},[s._v("' '")]),s._v(") : "),a("span",{attrs:{class:"hljs-string"}},[s._v("'placeholder'")]),s._v(")\n },\n mounted() {\n "),a("span",{attrs:{class:"hljs-keyword"}},[s._v("this")]),s._v(".picker = "),a("span",{attrs:{class:"hljs-keyword"}},[s._v("this")]),s._v(".$createCascadePicker({\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("title")]),s._v(": "),a("span",{attrs:{class:"hljs-string"}},[s._v("'PCA Select'")]),s._v(",\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("data")]),s._v(": cityData,\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("selectedIndex")]),s._v(": "),a("span",{attrs:{class:"hljs-keyword"}},[s._v("this")]),s._v(".value,\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("onSelect")]),s._v(": "),a("span",{attrs:{class:"hljs-keyword"}},[s._v("this")]),s._v(".selectHandler\n })\n },\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("methods")]),s._v(": {\n showPicker() {\n "),a("span",{attrs:{class:"hljs-keyword"}},[s._v("this")]),s._v(".picker.show()\n },\n selectHandler(selectedVal, selectedIndex, selectedTxt) {\n "),a("span",{attrs:{class:"hljs-keyword"}},[s._v("this")]),s._v(".selected = selectedTxt\n "),a("span",{attrs:{class:"hljs-keyword"}},[s._v("this")]),s._v(".$emit("),a("span",{attrs:{class:"hljs-string"}},[s._v("'input'")]),s._v(", selectedVal)\n }\n }\n}\n"),a("span",{attrs:{class:"hljs-keyword"}},[s._v("export")]),s._v(" "),a("span",{attrs:{class:"hljs-keyword"}},[s._v("default")]),s._v(" {\n data() {\n "),a("span",{attrs:{class:"hljs-keyword"}},[s._v("return")]),s._v(" {\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("validity")]),s._v(": {},\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("valid")]),s._v(": "),a("span",{attrs:{class:"hljs-literal"}},[s._v("undefined")]),s._v(",\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("model")]),s._v(": {\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("inputValue")]),s._v(": "),a("span",{attrs:{class:"hljs-string"}},[s._v("''")]),s._v(",\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("pcaValue")]),s._v(": [],\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("dateValue")]),s._v(": "),a("span",{attrs:{class:"hljs-string"}},[s._v("''")]),s._v("\n },\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("fields")]),s._v(": [\n {\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("type")]),s._v(": "),a("span",{attrs:{class:"hljs-string"}},[s._v("'input'")]),s._v(",\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("modelKey")]),s._v(": "),a("span",{attrs:{class:"hljs-string"}},[s._v("'inputValue'")]),s._v(",\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("label")]),s._v(": "),a("span",{attrs:{class:"hljs-string"}},[s._v("'Input'")]),s._v(",\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("props")]),s._v(": {\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("placeholder")]),s._v(": "),a("span",{attrs:{class:"hljs-string"}},[s._v("'请输入'")]),s._v("\n },\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("rules")]),s._v(": {\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("required")]),s._v(": "),a("span",{attrs:{class:"hljs-literal"}},[s._v("true")]),s._v("\n }\n },\n {\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("component")]),s._v(": PCA,\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("modelKey")]),s._v(": "),a("span",{attrs:{class:"hljs-string"}},[s._v("'pcaValue'")]),s._v(",\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("label")]),s._v(": "),a("span",{attrs:{class:"hljs-string"}},[s._v("'PCASelect'")]),s._v(",\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("rules")]),s._v(": {\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("required")]),s._v(": "),a("span",{attrs:{class:"hljs-literal"}},[s._v("true")]),s._v("\n },\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("messages")]),s._v(": {\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("required")]),s._v(": "),a("span",{attrs:{class:"hljs-string"}},[s._v("'请选择'")]),s._v("\n }\n },\n {\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("modelKey")]),s._v(": "),a("span",{attrs:{class:"hljs-string"}},[s._v("'dateValue'")]),s._v(",\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("label")]),s._v(": "),a("span",{attrs:{class:"hljs-string"}},[s._v("'Date'")]),s._v(",\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("rules")]),s._v(": {\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("required")]),s._v(": "),a("span",{attrs:{class:"hljs-literal"}},[s._v("true")]),s._v("\n }\n }\n ]\n }\n },\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("methods")]),s._v(": {\n submitHandler(e) {\n "),a("span",{attrs:{class:"hljs-built_in"}},[s._v("console")]),s._v(".log("),a("span",{attrs:{class:"hljs-string"}},[s._v("'submit'")]),s._v(")\n },\n validateHandler(result) {\n "),a("span",{attrs:{class:"hljs-keyword"}},[s._v("this")]),s._v(".validity = result.validity\n "),a("span",{attrs:{class:"hljs-keyword"}},[s._v("this")]),s._v(".valid = result.valid\n "),a("span",{attrs:{class:"hljs-built_in"}},[s._v("console")]),s._v(".log("),a("span",{attrs:{class:"hljs-string"}},[s._v("'validity'")]),s._v(", result.validity, result.valid, result.dirty, result.firstInvalidFieldIndex)\n },\n showDatePicker() {\n "),a("span",{attrs:{class:"hljs-keyword"}},[s._v("this")]),s._v(".$refs.datePicker.show()\n },\n dateSelectHandler(selectedVal) {\n "),a("span",{attrs:{class:"hljs-keyword"}},[s._v("this")]),s._v(".model.dateValue = "),a("span",{attrs:{class:"hljs-keyword"}},[s._v("new")]),s._v(" "),a("span",{attrs:{class:"hljs-built_in"}},[s._v("Date")]),s._v("(selectedVal["),a("span",{attrs:{class:"hljs-number"}},[s._v("0")]),s._v("], selectedVal["),a("span",{attrs:{class:"hljs-number"}},[s._v("1")]),s._v("] - "),a("span",{attrs:{class:"hljs-number"}},[s._v("1")]),s._v(", selectedVal["),a("span",{attrs:{class:"hljs-number"}},[s._v("2")]),s._v("]).toDateString()\n }\n },\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("components")]),s._v(": {\n DatePicker\n }\n}\n")])]),s._v(" "),a("p",[s._v("Like the "),a("code",{pre:!0},[s._v("PCA")]),s._v(" component, you can use "),a("code",{pre:!0},[s._v("component")]),s._v(" to define your custom component. Or use slots, like use DatePicker component.")])])])},function(){var s=this,t=s.$createElement,a=s._self._c||t;return a("table",[a("thead",[a("tr",[a("th",[s._v("Attribute")]),s._v(" "),a("th",[s._v("Description")]),s._v(" "),a("th",[s._v("Type")]),s._v(" "),a("th",[s._v("Accepted Values")]),s._v(" "),a("th",[s._v("Default")])])]),s._v(" "),a("tbody",[a("tr",[a("td",[s._v("model")]),s._v(" "),a("td",[s._v("The model/target JSON object")]),s._v(" "),a("td",[s._v("Object")]),s._v(" "),a("td",[s._v("-")]),s._v(" "),a("td",[s._v("{}")])]),s._v(" "),a("tr",[a("td",[s._v("schema")]),s._v(" "),a("td",[s._v("the schema object with fields")]),s._v(" "),a("td",[s._v("Object")]),s._v(" "),a("td",[s._v("-")]),s._v(" "),a("td",[s._v("{}")])]),s._v(" "),a("tr",[a("td",[s._v("immediate-validate")]),s._v(" "),a("td",[s._v("If true, we will run validation after load")]),s._v(" "),a("td",[s._v("Boolean")]),s._v(" "),a("td",[s._v("true/false")]),s._v(" "),a("td",[s._v("false")])]),s._v(" "),a("tr",[a("td",[s._v("action")]),s._v(" "),a("td",[s._v("Form action value")]),s._v(" "),a("td",[s._v("String")]),s._v(" "),a("td",[s._v("-")]),s._v(" "),a("td",[s._v("undefined")])]),s._v(" "),a("tr",[a("td",[s._v("options")]),s._v(" "),a("td",[s._v("Options for CubeForm")]),s._v(" "),a("td",[s._v("Object")]),s._v(" "),a("td",[s._v("-")]),s._v(" "),a("td",[s._v("{"),a("br"),s._v("scrollToInvalidField: false,"),a("br"),s._v(" layout: 'standard' // or: classic")])])])])},function(){var s=this,t=s.$createElement,a=s._self._c||t;return a("ul",[a("li",[a("p",[a("code",{pre:!0},[s._v("schema")]),s._v(" sub configuration")]),s._v(" "),a("p",[s._v("The schema contains the fields of the form, optionally in groups.")]),s._v(" "),a("ul",[a("li",[a("p",[s._v("Without groups")]),s._v(" "),a("p",[s._v("Use "),a("code",{pre:!0},[s._v("fields")]),s._v(":")]),s._v(" "),a("pre",{pre:!0},[a("code",{attrs:{"v-pre":"",class:"language-js"}},[s._v("{\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("fields")]),s._v(": [\n {\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("type")]),s._v(": "),a("span",{attrs:{class:"hljs-string"}},[s._v("'input'")]),s._v(",\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("modelKey")]),s._v(": "),a("span",{attrs:{class:"hljs-string"}},[s._v("'inputValue'")]),s._v(",\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("label")]),s._v(": "),a("span",{attrs:{class:"hljs-string"}},[s._v("'Input'")]),s._v("\n },\n "),a("span",{attrs:{class:"hljs-comment"}},[s._v("// ...")]),s._v("\n ]\n}\n")])])]),s._v(" "),a("li",[a("p",[s._v("With groups")]),s._v(" "),a("p",[s._v("Use "),a("code",{pre:!0},[s._v("groups")]),s._v("：")]),s._v(" "),a("pre",{pre:!0},[a("code",{attrs:{"v-pre":"",class:"language-js"}},[s._v("{\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("groups")]),s._v(": [\n {\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("legend")]),s._v(": "),a("span",{attrs:{class:"hljs-string"}},[s._v("'Group 1'")]),s._v("\n fields: [\n {\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("type")]),s._v(": "),a("span",{attrs:{class:"hljs-string"}},[s._v("'input'")]),s._v(",\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("modelKey")]),s._v(": "),a("span",{attrs:{class:"hljs-string"}},[s._v("'inputValue'")]),s._v(",\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("label")]),s._v(": "),a("span",{attrs:{class:"hljs-string"}},[s._v("'Input'")]),s._v("\n },\n "),a("span",{attrs:{class:"hljs-comment"}},[s._v("// ...")]),s._v("\n ]\n },\n {\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("legend")]),s._v(": "),a("span",{attrs:{class:"hljs-string"}},[s._v("'Group 2'")]),s._v("\n fields: [\n {\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("type")]),s._v(": "),a("span",{attrs:{class:"hljs-string"}},[s._v("'input'")]),s._v(",\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("modelKey")]),s._v(": "),a("span",{attrs:{class:"hljs-string"}},[s._v("'inputValue'")]),s._v(",\n "),a("span",{attrs:{class:"hljs-attr"}},[s._v("label")]),s._v(": "),a("span",{attrs:{class:"hljs-string"}},[s._v("'Input'")]),s._v("\n },\n "),a("span",{attrs:{class:"hljs-comment"}},[s._v("// ...")]),s._v("\n ]\n }\n ]\n}\n")])])])]),s._v(" "),a("p",[s._v("A field in the schema defines an input element to a value of model. The common properties of field:")]),s._v(" "),a("table",[a("thead",[a("tr",[a("th",[s._v("Attribute")]),s._v(" "),a("th",[s._v("Description")]),s._v(" "),a("th",[s._v("Type")]),s._v(" "),a("th",[s._v("Accepted Values")]),s._v(" "),a("th",[s._v("Default")])])]),s._v(" "),a("tbody",[a("tr",[a("td",[s._v("type")]),s._v(" "),a("td",[s._v("Type of field")]),s._v(" "),a("td",[s._v("String")]),s._v(" "),a("td",[s._v("Default fields: "),a("code",{pre:!0},[s._v("button")]),s._v(", "),a("code",{pre:!0},[s._v("checkbox")]),s._v(", "),a("code",{pre:!0},[s._v("checkbox-group")]),s._v(", "),a("code",{pre:!0},[s._v("input")]),s._v(", "),a("code",{pre:!0},[s._v("radio")]),s._v(", "),a("code",{pre:!0},[s._v("radio-group")]),s._v(", "),a("code",{pre:!0},[s._v("rate")]),s._v(", "),a("code",{pre:!0},[s._v("select")]),s._v(", "),a("code",{pre:!0},[s._v("switch")]),s._v(", "),a("code",{pre:!0},[s._v("textarea")]),s._v(", "),a("code",{pre:!0},[s._v("upload")]),s._v(". There are two special types: "),a("code",{pre:!0},[s._v("submit")]),s._v(" and "),a("code",{pre:!0},[s._v("reset")]),s._v(", they will be transformed to the corresponding type of "),a("code",{pre:!0},[s._v("button")]),s._v(".")]),s._v(" "),a("td",[s._v("-")])]),s._v(" "),a("tr",[a("td",[s._v("component")]),s._v(" "),a("td",[s._v("Custom filed component to replace "),a("code",{pre:!0},[s._v("type")]),s._v(", the component should to work with "),a("code",{pre:!0},[s._v("v-model")])]),s._v(" "),a("td",[s._v("Object/String")]),s._v(" "),a("td",[s._v("-")]),s._v(" "),a("td",[s._v("-")])]),s._v(" "),a("tr",[a("td",[s._v("modelKey")]),s._v(" "),a("td",[s._v("Name of property in the "),a("code",{pre:!0},[s._v("form")]),s._v(" model")]),s._v(" "),a("td",[s._v("String")]),s._v(" "),a("td",[s._v("-")]),s._v(" "),a("td",[s._v("-")])]),s._v(" "),a("tr",[a("td",[s._v("label")]),s._v(" "),a("td",[s._v("Label of field")]),s._v(" "),a("td",[s._v("String")]),s._v(" "),a("td",[s._v("-")]),s._v(" "),a("td",[s._v("-")])]),s._v(" "),a("tr",[a("td",[s._v("props")]),s._v(" "),a("td",[s._v("This value will be the "),a("code",{pre:!0},[s._v("type")]),s._v(" or "),a("code",{pre:!0},[s._v("component")]),s._v(" props")]),s._v(" "),a("td",[s._v("Object")]),s._v(" "),a("td",[s._v("-")]),s._v(" "),a("td",[s._v("-")])]),s._v(" "),a("tr",[a("td",[s._v("rules")]),s._v(" "),a("td",[s._v("Validator rules, see "),a("a",{attrs:{href:"#/en-US/docs/validator#cube-Props-anchor"}},[s._v("Validator")])]),s._v(" "),a("td",[s._v("Object")]),s._v(" "),a("td",[s._v("-")]),s._v(" "),a("td",[s._v("-")])]),s._v(" "),a("tr",[a("td",[s._v("messages")]),s._v(" "),a("td",[s._v("Validator messages, see "),a("a",{attrs:{href:"#/en-US/docs/validator#cube-Props-anchor"}},[s._v("Validator")])]),s._v(" "),a("td",[s._v("String")]),s._v(" "),a("td",[s._v("-")]),s._v(" "),a("td",[s._v("-")])])])])])])},function(){var s=this,t=s.$createElement,a=s._self._c||t;return a("table",[a("thead",[a("tr",[a("th",[s._v("Attribute")]),s._v(" "),a("th",[s._v("Description")]),s._v(" "),a("th",[s._v("Type")]),s._v(" "),a("th",[s._v("Accepted Values")]),s._v(" "),a("th",[s._v("Default")])])]),s._v(" "),a("tbody",[a("tr",[a("td",[s._v("legend")]),s._v(" "),a("td",[s._v("Group legend")]),s._v(" "),a("td",[s._v("String")]),s._v(" "),a("td",[s._v("-")]),s._v(" "),a("td",[s._v("''")])]),s._v(" "),a("tr",[a("td",[s._v("fields")]),s._v(" "),a("td",[s._v("Group fields")]),s._v(" "),a("td",[s._v("Array")]),s._v(" "),a("td",[s._v("-")]),s._v(" "),a("td",[s._v("[]")])])])])},function(){var s=this,t=s.$createElement,a=s._self._c||t;return a("table",[a("thead",[a("tr",[a("th",[s._v("Attribute")]),s._v(" "),a("th",[s._v("Description")]),s._v(" "),a("th",[s._v("Type")]),s._v(" "),a("th",[s._v("Accepted Values")]),s._v(" "),a("th",[s._v("Default")])])]),s._v(" "),a("tbody",[a("tr",[a("td",[s._v("field")]),s._v(" "),a("td",[s._v("Field value")]),s._v(" "),a("td",[s._v("Object")]),s._v(" "),a("td",[s._v("-")]),s._v(" "),a("td",[s._v("-")])])])])},function(){var s=this,t=s.$createElement,a=s._self._c||t;return a("table",[a("thead",[a("tr",[a("th",[s._v("Event Name")]),s._v(" "),a("th",[s._v("Description")]),s._v(" "),a("th",[s._v("Parameters 1")]),s._v(" "),a("th",[s._v("Parameters 2")])])]),s._v(" "),a("tbody",[a("tr",[a("td",[s._v("submit")]),s._v(" "),a("td",[s._v("Form submit, only trigged when the form's validation is ok")]),s._v(" "),a("td",[s._v("e - event")]),s._v(" "),a("td",[s._v("form model value")])]),s._v(" "),a("tr",[a("td",[s._v("reset")]),s._v(" "),a("td",[s._v("Form reset")]),s._v(" "),a("td",[s._v("e - event")]),s._v(" "),a("td",[s._v("-")])]),s._v(" "),a("tr",[a("td",[s._v("validate")]),s._v(" "),a("td",[s._v("Form validated")]),s._v(" "),a("td",[s._v("Properties: "),a("br"),s._v("{"),a("br"),s._v("validity,"),a("br"),s._v(" valid,"),a("br"),s._v(" invalid,"),a("br"),s._v(" dirty,"),a("br"),s._v(" firstInvalidFieldIndex"),a("br"),s._v("}")]),s._v(" "),a("td",[s._v("-")])]),s._v(" "),a("tr",[a("td",[s._v("valid")]),s._v(" "),a("td",[s._v("Form valid")]),s._v(" "),a("td",[s._v("Validity result")]),s._v(" "),a("td",[s._v("-")])]),s._v(" "),a("tr",[a("td",[s._v("invalid")]),s._v(" "),a("td",[s._v("Form invalid")]),s._v(" "),a("td",[s._v("Validity result")]),s._v(" "),a("td",[s._v("-")])])])])},function(){var s=this,t=s.$createElement,a=s._self._c||t;return a("ul",[a("li",[a("p",[a("code",{pre:!0},[s._v("validate")]),s._v(" event parameters")]),s._v(" "),a("table",[a("thead",[a("tr",[a("th",[s._v("Attribute")]),s._v(" "),a("th",[s._v("Description")]),s._v(" "),a("th",[s._v("Type")])])]),s._v(" "),a("tbody",[a("tr",[a("td",[s._v("validity")]),s._v(" "),a("td",[s._v("Validity result")]),s._v(" "),a("td",[s._v("Object")])]),s._v(" "),a("tr",[a("td",[s._v("valid")]),s._v(" "),a("td",[s._v("Validity check, if not verified this value will be undefined, once checked this value will be true or false")]),s._v(" "),a("td",[s._v("Boolean/Undefined")])]),s._v(" "),a("tr",[a("td",[s._v("invalid")]),s._v(" "),a("td",[s._v("Validity check, if not verified this value will be undefined, once checked this value will be true or false")]),s._v(" "),a("td",[s._v("Boolean")])]),s._v(" "),a("tr",[a("td",[s._v("dirty")]),s._v(" "),a("td",[s._v("When the form model changed then the form's dirty is true")]),s._v(" "),a("td",[s._v("Boolean")])]),s._v(" "),a("tr",[a("td",[s._v("firstInvalidFieldIndex")]),s._v(" "),a("td",[s._v("First invalid field index")]),s._v(" "),a("td",[s._v("Number")])])])]),s._v(" "),a("ul",[a("li",[a("p",[s._v("Validity result "),a("code",{pre:!0},[s._v("validity")])]),s._v(" "),a("table",[a("thead",[a("tr",[a("th",[s._v("Attribute")]),s._v(" "),a("th",[s._v("Description")]),s._v(" "),a("th",[s._v("Type")])])]),s._v(" "),a("tbody",[a("tr",[a("td",[s._v("valid")]),s._v(" "),a("td",[s._v("Is valid or not")]),s._v(" "),a("td",[s._v("Boolean/Undefined")])]),s._v(" "),a("tr",[a("td",[s._v("result")]),s._v(" "),a("td",[s._v("Result, eg: "),a("br"),s._v("{"),a("br"),s._v(" required: {"),a("br"),s._v(" valid: false,"),a("br"),s._v(" invalid: true,"),a("br"),s._v(" message: 'Required.'"),a("br"),s._v(" }"),a("br"),s._v("}")]),s._v(" "),a("td",[s._v("Object")])]),s._v(" "),a("tr",[a("td",[s._v("dirty")]),s._v(" "),a("td",[s._v("The form model is changed or not")]),s._v(" "),a("td",[s._v("Boolean")])])])])])])])])},function(){var s=this,t=s.$createElement,a=s._self._c||t;return a("table",[a("thead",[a("tr",[a("th",[s._v("Method name")]),s._v(" "),a("th",[s._v("Description")])])]),s._v(" "),a("tbody",[a("tr",[a("td",[s._v("submit")]),s._v(" "),a("td",[s._v("submit form")])]),s._v(" "),a("tr",[a("td",[s._v("reset")]),s._v(" "),a("td",[s._v("reset form")])]),s._v(" "),a("tr",[a("td",[s._v("validate")]),s._v(" "),a("td",[s._v("validate form")])])])])}]}},nzGO:function(s,t,a){s.exports=a("4+v0")}});