## 常見問題
### 該文檔不再維護,新版文檔地址: [form-create 文檔](http://fc.gd8.top)
>**說明**: $f為創建表單后返回的實例,field 為字段名稱,rule 為表單生成規則
- ### 手動修改某個字段的值
1. `$f.bind().field = '修改后的值' `
2. `$f.model().field.value = '修改后的值'`
3. `rule[2].value = '修改后的值' //rule[2]是field字段的生成規則`
**說明**: 如果修改的值為數組必須直接賦值或使用`push`,`splice`等方法修改
- ### 動態修改表單規則
1. `$f.model().field.rule.props.disabled = false`
2. `rule[2].props.disabled = false //rule[2]是 field字段的生成規則`
**說明**: 如果修改后沒有生效,需要提前在生成規則里定義該規則
- ### 新增表單字段
1. 在 goods_name 字段后面增加一份圖片上傳組件,默認添加到尾部
```javascript
$f.append($formCreate.maker.upload(
'產品主圖',
'logo',
'http://img1.touxiang.cn/uploads/20131030/30-075657_191.jpg'
).props({
"action": "",
"maxLength": 1,
"multiple": false,
"type": "select",
"uploadType": "image",
"name": "file",
"onSuccess": function () {
return 'http://img1.touxiang.cn/uploads/20131030/30-075657_191.jpg';
}
})
.validate({required:true, type: 'array', min: 1, message: '請上傳1張圖片', trigger: 'change'}
),'goods_name');
```
2. 在 goods_name 字段之前增加一份 input 組件,默認添加到頭部
```javascript
$f.prepend({
type:"input",
title:"商品簡介",
field:"goods_info",
value:"",
props: {
"type": "text",
"placeholder": "請輸入商品簡介",
},
validate:[
{ required: true, message: '請輸入商品簡介', trigger: 'blur' },
],
},'goods_name');
```
3. 在表單尾部追加一個 input 組件
```javascript
rule.push({
type:"input",
title:"商品簡介",
field:"goods_info",
value:"",
props: {
"type": "text",
"placeholder": "請輸入商品簡介",
},
validate:[
{ required: true, message: '請輸入商品簡介', trigger: 'blur' },
],
})
```
- ### 文件上傳成功后修改字段值
1. 通過返回值自動修改字段值
```javascript
//定義文件上傳成功后回調函數
props.onSuccess = (response)=>{
var filePath = response.data.data.url;
return filePath;
}
```
2. 手動修改字段值
```javascript
//定義文件上傳成功后回調函數
props.onSuccess = (response)=>{
var filePath = response.data.data.url;
$f.bind().field.push(filePaht);
}
```
- ### 隱藏指定字段
1. `$f.hidden(field)`
2. `$f.model().field.rule.props.hidden = true`
- ### 監聽組件事件
1. 通過配置參數監聽組件事件
```javascript
//定義文件上傳成功后回調函數
event.click = ()=>{
}
```
2. 標簽模式下監聽組件事件
```html
<form-create @field-click="handler" />
```
- ### 根據后臺返回的規則生成表單
```javascript
request('api').then(rule=>{
$f = formCreate.create(rule,{
onSubmit(formData){
// 表單提交事件
$f.btn.loading(true);
//TODO 提交表單
}
})
})
```
- ### 隱藏默認提交按鈕
設置全局配置`options.submitBtn = false`即可隱藏
- ### 顯示默認重置按鈕
設置全局配置`options. resetBtn = true`即可顯示
