本文实例为大家分享了iview实现图片上传的具体代码,供大家参考,具体内容如下
如下图片:这里结合iview里面表单验证做的
完整代码如何
<template> <div> <div class="navigation"> <p> <span>管理首页 > 应用 > 抢单侠> 信贷管理> {{title}}</span> </p> </div> <div class="clearfix contentcss sales-statis"> <Form ref="formValidate" :model="formValidate" :rules="ruleValidate" :label-width="80"> <FormItem label="模板名称:" prop="templatename"> <Input v-model="formValidate.templatename" placeholder="请输入模板名称" style="width:240px"></Input> </FormItem> <FormItem label="模板类别:" prop="templatetype"> <Select v-model="formValidate.templatetype" placeholder="请选择模板类别" style='width:240px;'> <Option v-for="item in templateList" :value="item.templateCode" :key="item.templateCode">{{ item.templateName }}</Option> </Select> </FormItem> <FormItem label="开放范围:" prop="openrange"> <Select v-model="formValidate.openrange" placeholder="请选择开放范围" style='width:240px;'> <Option v-for="item in openrangeList" :value="item.openrangeCode" :key="item.openrangeCode">{{ item.openrangeName }}</Option> </Select> </FormItem> <FormItem label="上传图片:" prop="productlogo"> <Upload action="" :before-upload="handleUploadicon" :show-upload-list="false" :format="['jpg','jpeg','png', 'gif']" :on-format-error="handleFormatError1"> <img class="iconlabelUrl" :src="/UploadFiles/2021-04-02/formValidate.labelUrl">关于vue.js组件的教程,请大家点击专题vue.js组件学习教程进行学习。
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持。