iview+form-create实现图片上传预览删除效果代码-html代码-BFW代码库

iview+form-create实现图片上传预览删除效果代码

代码语言：html

所属分类：上传

代码描述：iview+form-create实现图片上传预览删除效果代码

下面为部分代码预览，完整代码请点击下载或在bfwstudio webide中打开

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>BFW NEW PAGE</title>
    <link type="text/css" rel="stylesheet" href="//repo.bfw.wiki/bfwrepo/css/iview.css">
    <script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/vue@2.6.1.js"></script>
    <script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/iview.min.js"></script>
    <script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/form-create.iview.js"></script>
<style>
    body{
        padding: 40px;
    }
</style>
</head>
<body>

    <div id="app">
      
        <form-create :rule="rule" />
    </div>
    <script type="text/javascript">
        new Vue({
            el: "#app",
            data: {
                rule: [formCreate.maker.upload('轮播图1', 'pic1', '//repo.bfw.wiki/bfwrepo/image/5d65ea7d8bc8b.png?x-oss-process=image/auto-orient,1/resize,m_fill,w_100,h_100,/quality,q_90')
                    .props({
                        "action": "",
                        "maxLength": 1,
                        "multiple": true,
                        "type": "select",
                        "uploadType": "image",
                        "name": "file",
                        allowRemove: true,
                        "onSuccess": function() {
                            return '//repo.bfw.wiki/bfwrepo/image/5d65ea7d8bc8b.png?x-oss-process=image/auto-orient,1/resize,m_fill,w_100,h_100,/quality,q_90';
              .........完整代码请登录后点击上方下载按钮下载查看