一、Formcreate upload
Formcreate提供了一个便捷的上传组件，可以在前端中方便地上传文件，支持多种格式的文件上传，例如图片、文本、PDF等等。在使用upload组件前，需要先引入相关的文件：
/* 引入相关CSS文件 */
import "form-create/dist/form-create.css"
/* 引入相关JS文件 */
import formCreate from "form-create";
/* 注册upload组件 */
formCreate.component('fcUpload');
定义一个名称为uploadForm的表单，设置上传文件的大小为2MB，最多上传3个文件的示例代码如下：
/* 上传组件的配置 */
const uploadConfig = {
action: '//jsonplaceholder.typicode.com/posts/',
'btn-text': '上传',
multiple:true,
maxNumber: 3,
list-type: 'picture-card',
limit: 2 * 1024 * 1024,
name: 'file'
}
/* 定义一个名为uploadForm的表单实例 */
const uploadForm = formCreate({
el: '#uploadForm',
formDesc: ['fileList'],
formSubmitBtn: false,
formResetBtn: false,
formItem: [
{
type: 'fcUpload',
field: 'fileList',
title: '上传文件',
upload: uploadConfig
}
]
})
二、怎么修改formcreate的样式
Formcreate的样式可以通过修改相关的CSS文件或者覆盖相关CSS样式来进行修改。如果直接修改核心CSS文件会影响整个系统的样式，建议在自定义的CSS样式文件中对相关组件进行样式的覆盖。以自定义icon为例，代码如下：
/* 引入相关CSS文件 */
import 'form-create/dist/form-create.css'
/* 自定义图标样式 */
.icon-upload {
font-size: 20px;
color: blue;
}
上述代码中，样式名为icon-upload的图标样式被修改为蓝色，并增加了20px的字体大小。
三、Formcreate官网
Formcreate官网提供了详细的组件文档、示例代码、API文档等内容，可以通过以下链接进行访问：
四、Formcreate vue3
Formcreate vue3是一个基于Vue3框架的表单解决方案。FormCreateVue3魔法开始之前，需要在项目中添加配置文件 vue.config.js，并写入以下代码：
/* 引入相关插件 */
const vuePlugin = require('@vitejs/plugin-vue')
const formCreatePlugin = require('form-create/plugin')
module.exports = {
plugins: [
vuePlugin(),
formCreatePlugin()
]
}
在Vue3组件中使用Formcreate的示例代码如下：
提交
原创文章，作者：小蓝，如若转载，请注明出处：https://www.506064.com/n/151867.html
微信扫一扫 
支付宝扫一扫 