草庐IT

audio_element

全部标签

vue+element UI之el-select和el-tree实现单选/复选/搜索组件封装

  最近在写代码的时候遇到一个需求,就是需要试用下拉菜单完成二级菜单选择、甚至有三级的菜单选择:  UI提出此功能需要有以下三个要点:在不同的情况下要实现单选或者多选选择的内容要回调在输入框内既可以下拉选择又可以搜索选择  基于此,我开始设计了这个组件。话不多说上效果图。多选效果图单选效果图 &emsp话不多说上代码:父组件template>divclass="demo">elTree:list="options":defaultProps="defaultProps"@getdetail="getdetail":selectType="selectType">/elTree>/div>/te

Vue + Element-ui实现后台管理系统---项目搭建 + ⾸⻚布局实现

目录:导读项目搭建+⾸⻚布局实现一、项目搭建1、环境搭建2、项目初期搭建二、Main.vue三、左侧栏部分(CommonAside.vue)四、header部分(CommonHeader.vue)五、Home.vue写在最后项目搭建+⾸⻚布局实现这篇主要讲解项目搭建+后台⾸⻚布局实现:整体效果后台首页按布局一共包含3个部分:1、左侧栏部分2、头部部分3、内容部分。说明在整个后台管理系统中,左侧栏和头部部分是应该一直在页面中展示的,所以对于每个页面这两个组件都应该存在,而内容部分才是通过router的跳转而跳到不同的组件。下面先把整个项目搭建一下,然后再来讲解上面三个部分一、项目搭建1、环境搭建

基于Element UI或Element Plus实现具有倒计时的Message消息提示

刚好遇到一个需要自动关闭消息提示的需求,可Element框架暂时没有实现这个功能。开始时没有头绪,于是搜一下道友的博客文章,看到有一篇文章实现了这个功能,在此我完善了一下这个技巧方法。完善后的技巧方法支持多次点击,实例化多个消息提示,每个消息提示都具有自己的倒计时。以及可在ElementUI或ElementPlus框架上实现。一、首先新建文件/src/utils/elementUtil.ts二、在ElementUI框架上的实现import{Message}from'element-ui'lettimer=null/***倒计时Message方法*/functioncoutdownTime(ms

element-ui中this.$confirm提示文字中,部分有颜色(自定义)

如图想要让element-ui中的提示文字中,部分有颜色可以如下设置:MessageBox组件可以通过传递一个HTML片段来自定义对话框内容的样式。注意,在使用MessageBox组件时需要添加dangerouslyUseHTMLString:true选项来启用自定义HTML片段。可以直接这么写this.$confirm('请确认是否将该干预策略下线,确认后立即生效。','下线确认',{confirmButtonText:'确定下线',cancelButtonText:'取消',dangerouslyUseHTMLString:true,type:'warning',}).then(()=>{

【Element-UI】Mock.js,案例首页导航、左侧菜单

目录一、引言二、Mock.js1、什么是Mock.js2、安装配置2.1、安装2.2、引入3、Mock.js的使用3.1、定义测试数据文件3.2、mock拦截ajax请求3.3、模拟测试三、首页导航、左侧菜单1、页面搭建1.1、图标定义1.2、AppMain.vue1.3、LeftNav.vue1.4、TopNav.vue1.5、index.js2、功能实现2.1、AppMain.vue2.2、LeftNav.vue2.3、TopNav.vue2.4、main.js3、完整代码3.1、AppMain.vue3.2、LeftNav.vue3.3、TopNav.vue3.4、main.js一、引言

element ui时间选择器el-date-picker关于日期禁用disabledDate的使用

项目中很多场景都用到时间范围选择的组件: 这时候我们过多选择的是elmentui里面的el-date-picker组件,但是又嫌弃人家原始的这个丑陋 所以选择自己组装,有没有小伙伴像我这样写的呢://页面组件-//日期禁用方法disabledDateStart(time){constbeginDateVal=this.datePickerEnd;if(beginDateVal){return(time.valueOf()>=newDate(beginDateVal).valueOf()-24*60*60*1000+1);}},disabledDateEnd(time){constbeginDa

Unity-Audio-编辑器中运行没有声音的解决方案

一、外部配置检查1、检查播放设备是否选择正确         2、检查播放的音频文件是否损坏,能否用系统自带播放器播放二、Unity中检查1、检查AudioListener和AudioSource组件 (1)是否挂载了这两个组件          Unity中播放音频必须有这两个组件(2)AudioSoure组件的AudioClip属性是否为None         不管是直接拖拽进去的还是运行时动态赋值的都需要检查是否正确赋予了AudioClip属性(3)AudioSoure组件的Volume属性是否为0         这个属性为该播放器的音量大小 (4)如果是3D音,是否是距离问题   

element-ui在项目当中的引入以及按需引入使用

目录1.项目当中引入element-uiA.先使用npm安装B.在main.js当中引入文件C.在App.vue当中可以引用button相关的UI组件 2.element-ui配合脚手架按需引入A.首先安装按需引入的插件B.修改.babelrcC.按需引入的好处1.项目当中引入element-uiA.先使用npm安装npmielement-ui-SB.在main.js当中引入文件importVuefrom'vue';importElementUIfrom'element-ui';import'element-ui/lib/theme-chalk/index.css';importAppfrom

构建远程音乐库!群晖Audio Station公开共享音频实现公网访问

不再担心会员限制,自由分享音乐专辑!文章目录不再担心会员限制,自由分享音乐专辑!1.本教程使用环境:2.制作音频分享链接3.制作永久固定音频分享链接:之前文章我详细介绍了如何在公网环境下使用pc和移动端访问群晖audiostation:公网访问群晖audiostation听歌-cpolar极点云群晖套件不仅能读写本地文件,还能共享,那么我们如何以共享链接的形式分享本地音频文件呢?按照本教程方法操作后,达到的效果是公网环境下(连接其他局域网/流量)使用移动端(ios,安卓,ipad等)都可以通过群晖audiostation读取存储在家中电脑硬盘上的音频文件(mp3等格式)。1.本教程使用环境:首

如何实现element UI中table操作栏更多按钮的展示与折叠?

解决思路:​直接使用elementUI文档上Popover弹出框组件废话不多说,直接上代码吧