首页 > 其他分享 >vue的template中el-uplaod属性使用变量的方法

vue的template中el-uplaod属性使用变量的方法

时间:2023-08-16 18:33:15浏览次数:41  
标签:webSite el vue false template uplaod data

template

 <el-form-item label="上传图片" :rules="[{ required: true, message: '必须要上传图片', trigger: 'blur' }]"
                        prop="image">
            <el-upload
                :action=webSite
                class="upload-demo"
                drag
                :limit="1"
                :before-upload="beforeUpload"
                :on-success="handleSuccess"
                :on-remove = "handleRemove"
                :show-file-list="true" >
              <i class="el-icon-upload"></i>
              <div class="el-upload__text">将文件拖到此处,或<em>点击上传</em></div>
              <div class="el-upload__tip" slot="tip">只能上传jpg/png文件,且不超过4M</div>
            </el-upload>
          </el-form-item>

属性绑定变量时前面加:

在data中直接进行定义即可

 data() {
    return {
      dialogTableVisible: false,
      dialogFormVisible: false,
      formLabelWidth: '100px',
      form: {
        show: true,
      },
      webSite: this.$webSite + "/manage/image_upload/"
    }
  },

 

标签:webSite,el,vue,false,template,uplaod,data
From: https://www.cnblogs.com/lytcreate/p/17635925.html

相关文章

  • 使用hutool封装的Excel工具类
    好用的工具类hutool工具类hutool操作excel这篇文章使用hutool的excel包封装项目中使用的excel工具类;引入包可以简单直接引入hutool-all,但是如果不用其他的话建议单独引入excel包<dependency><groupId>cn.hutool</groupId><artifactId>hutool-......
  • 前端vue使用blob下载流文件
    请求后端接口,发现返回的是这么一堆东西 代码:axios:exportfunctionexportEcoCarAppoint(params){returnHttp({url:'/api/jsis/ecoCarAppoint/exportEcoCarAppoint',method:'POST',data:params,responseType:'blob',//设置响应......
  • excel 输出demo(outputstream 转inputstr)
    protectedvoidresponseExcel(HSSFWorkbookworkbook)throwsIOException{ByteArrayOutputStreamos=newByteArrayOutputStream();try{workbook.write(os);}catch(IOExceptione){e.printStackTrace();}byte[]content......
  • 解决 composer 安装 laravel 报错
    执行#composercreate-projectlaravel/laravellaravel9报错Creatinga"laravel/laravel"projectat"./laravel9"Installinglaravel/laravel(v10.2.1) -Downloadinglaravel/laravel(v10.2.1) -Installinglaravel/laravel(v10.2.1):Extract......
  • HDFS shell 常用命令
    创建多级目录(-p):hadoopfs-mkdir-p/test/a/b 展示目录:hadoopfs-ls/ 递归展示:hadoopfs-ls-R/ 从HDFS上下载文件到本地:hadoopfs-get/test/a/b/h.txthadoopfs-copyToLocal  /test/a/b/h.txt 从本地上传文件到HDFS:hadoopfs-copyFromLocalhello......
  • vue-treeselect 校验失败添加红框
    需求vue-treeselect校验及清除校验这篇介绍了用@input在校验失败时显示校验信息。但还需要同时显示红色边框。如下图所示:解决办法思路:动态绑定类名,校验失败时切换类名,更改边框颜色。子组件SelectTree二次封装vue-treeselect:组件SelectTree<template><divclass=......
  • Delphi正则表达式初学入门
    一前言 对于正则表达式,相信很多人都知道,但是很多人的第一感觉就是难学,因为看第一眼时,觉得完全没有规律可寻,而且全是一堆各种各样的特殊符号,完全不知所云。 其实只是对正则不了解而以,了解了你就会发现,原来就这样啊正则所用的相关字符其实不多,也不难记,更不难懂,唯一难的就......
  • 使用hutool给excel单元格标黄和添加批注
    packagecom.yc.cloud.excel.util;importcn.hutool.poi.excel.ExcelWriter;importlombok.extern.slf4j.Slf4j;importorg.apache.poi.hssf.usermodel.HSSFClientAnchor;importorg.apache.poi.hssf.usermodel.HSSFRichTextString;importorg.apache.poi.ss.usermodel.......
  • vite打包报错:ERROR: Top-level await is not available in the configured target env
    在开发时,vita打包报错如下: 原因:ECMAScript提案Top-levelawait由MylesBorins提出,它可以让你在模块的最高层中使用await操作符。在这之前,你只能通过在async函数或asyncgenerators中使用await操作符。Top-levelawait是个新特性,打包不支持此特性。解决方案:1.......
  • 对于MySQL的innodb存储引擎,‘select count(*) ’、‘select count(id)’、‘select co
    让我们重新审视那三个查询在InnoDB存储引擎中的行为:selectcount(*)fromtable;这个查询用于计算表中的所有行数。当使用count(*)时,MySQL不会去检查列的值,它只关心行数。对于InnoDB,这并不意味着它可以从某个内部计数器快速获取行数,而是需要对整个表或满足查询条件的相......