草庐IT

layui-icon

全部标签

uniapp uni-icons 组件为例 带着大家使用并熟悉一次文档

uni的组件都可以直接进入官网https://uniapp.dcloud.net.cn/然后点击右上角的搜索直接在输入框中搜索uni-icons下面内容就都出来了在最上面先点击下载和按在进入界面后点击箭头指向出进行下载如果你系统有HBuilderX就会自动打开要你选择安装在哪一个项目里如果你的HBuilderX有项目在运行则无法安装安装成功后我们继续回到刚才的文档先看下面的API看看每个字段都是干什么的这里我们只需要两个size控制尺寸大小的type控制图标的方案类型他让我们参考案例然后我们看案例这里就有非常多的图标给我选最上面就是基础用法那么我们就可以理解为uni-iconstype="图标

微信小程序项目中使用icon图标

效果:步骤:1、先让ui负责人把你的账号加入到项目中,加入到项目中后就可以在icon图标库中看到该项目2、在小程序中使用新建一个view,在上面加一个class,复制icon名字上去即可,注意格式,格式为iconfonticon名。iconfont这个前缀不是固定的,根据icon名字来,icon的前缀为my-icon-xxxx,那么前缀就是my-icon没有前缀或者设置了前缀,一般都是使用iconfont,根据项目视情况而定,这里以my-icon举例。my-iconmy-icon-fontxxx//前缀icon名//使用iconviewclass="fontxxxmy-iconmy-icon-

基于Layui的登录注册页面模板

在layui版本2.8+中,提供了好看的登录注册模板。目录1、登录模板(1)效果预览(2)完整代码2、注册模板 (1)效果预览​(2)完整代码1、登录模板(1)效果预览官网地址:表单组件form-Layui文档(2)完整代码QuickStart-Layui.demo-login-container{width:320px;margin:21pxauto0;}.demo-login-other.layui-icon{position:relative;display:inline-block;margin:02px;top:2px;font-size:26px;}忘记密码?登录社交账号登录或注册

layui选择多张图片上传多图上传到服务器保存

多图上传在一些特殊的需求中我们经常会遇到,其实多图上传的原理大家都有各自的见解。对于Layui多图上传和我之前所说的通过js获取文本框中的文件数组遍历提交的原理一样,只不过是Layui中的upload.render方法已经帮我们封装好了,我们只管调用即可,也就是说你选中了几张图片,那么将会向后台请求与图片张数相同的次数,即为遍历提交的方式。前端:多图上传上传附件多图片上传预览:提交//这里一定要设置全局变量,不然下面用的时候,未定义varmultiple_images=[];varlayer,form,laypage,laydate,upload,layedit,indexs,indexsMa

Layui Table 鼠标悬浮弹层显示超出内容、Table基本操作

JS的DOM之鼠标悬浮事件鼠标悬浮事件之mouseover()和mouseout()事件鼠标在这块区域时候会触发相应事件,将鼠标挪开则恢复原先事件functiontableInit(excels){table.render({elem:'#partList',height:'400',cols:[[//设置行自增编号{type:'numbers',fixed:'left'},{field:'path',title:s_path,align:'center',templet:function(d){varimgSrc=setter.atlasHost+d.pathreturn''}},//设置列

Layui table的动态表格lay-data怎么传递参数给后端

Layuitable的动态表格lay-data怎么传递参数给后端前端代码:IDID用户姓名邮箱手机号码状态添加时间操作js代码:(function(){//加载列表的后端urlvargetListUrl='';//对于任意一个table,按照官方的说法,有三种不同的初始化渲染方式,不多介绍,而这里使用的方式姑且看做第三种:转换静态表格方式//转换静态表格方式,自然首先需要有一个已经存在的表格,然后再通过js方式转化为Layui表格//无论哪种方式的Layuitable初始化自然需要配置项//通过转化的方式初始化Layuitable,配置项部分可以在源table中,部分在js中,源table的源

uni-ui组件库uni-icons不显示

问题:按照官方文档用yarn引用了uni-ui组件库并且在pages.json和vue.config.js中配置了相关的内容后使用uni-icon效果如下: 使用uni-icons的地方图标都未显示成功解决:1-按照项目名称\node_modules\@dcloudio\uni-ui\lib\uni-icons目录找到uni-icons目录2-将uni-icons目录放到src目录下的components目录下3-在pages.json文件中添加配置项 "easycom":{     "autoscan":true,     "custom":{        "^uni-((?!(shado

解决Failed to resolve import “@element-plus/icons-vue“ from “src\views\Home.vue“. Does the file exist?

解决在Vue3+Vite中使用Element-plus报错一、安装镜像(可选)使用阿里定制的cnpm命令行工具代替默认的npm,输入以下代码npminstall-gcnpm--registry=http://registry.npmmirror.com二、解决报错1.安装Element-plus1.1在项目目录下执行:cnpminstallelement-plus--save1.2安装按需引入需要的插件:cnpminstall-Dunplugin-vue-componentsunplugin-auto-import1.3安装ElementIcon(解决标题所言的报错)cnpminstall@e

Element-ui关于el-icon无法正常显示的问题(已解决)

在使用element-ui组件库的时候,使用自带的图标不显示,查了好多篇博客,都说是element-ui的版本老了,在package.json中修改版本重新安装就行,但是我的情况不是这样。最后解决看了这篇博客:https://blog.csdn.net/weixin_44835957/article/details/115009973要在main.js文件中引入图标的样式文件:

微信小程序把阿里icon变为组件

js文件:// components/icon/iconfont.jsComponent({  /**   * 组件的属性列表   */  properties: {    size: String,    color: String,    icon: String  }})json组件{"component":true,"usingComponents":{}}wxml{icon}}"style="{{color?'color:'+color+';':''}}{{size?'font-size:'+size+'rpx;':''}}">wxss/*components/icon/iconfo