草庐IT

vue-elementul

全部标签

vscode vue ctrl+鼠标左键点击函数名无法跳转问题解决

在vscode中安装插件vue-helper即可(vue-helper支持CTRL+点击函数跳转||绑定对象跳转)

前端(js+vue)选择题+判断题+问答题

1、下面代码输出什么?(C)functionaddToList(item,list){ returnlist.push(item)}varresult=addToList('apple',['banana'])console.log(result)A:['banana','apple']B:['apple','banana']C:2D:true2、下列哪种数组的方法不会修改数组本身?(A)A:slice  B:splice  C:sort D:unshift3.、请问下面那个方法可以删除数组最后一个元素?(C)A:shift() B: unshift() C:pop() D:push()4、以

Vue中实现WEBSOCKET前后端通讯

前言:什么是WebSocket?WebSocket和http一样,都是一种网络传输协议,但是和Http协议相比,它有一点不同,它可以在单个TCP连接上进行全双工通信,通俗来说就是客户端可以向服务端发送请求,服务端也可以向客户端发送请求;总的来说:http协议服务端响应到客户端是被动的,而webSocket协议服务端请求到客户端是主动的。这张图网上有很多,完美展示了http和webSocket的区别:在Vue项目中安装WebSocket库//npminstall--savewebsocketnpminstall--savevue-native-websocketmain.js全局配置import

vue+Element UI实现表格表头纵向显示

提示:文章写完后,目录可以自动生成,如何生成可参考右边的帮助文档vue+ElementUI实现表格纵向显示前言element框架的teble表格的数据展示由横向转向竖向,主要包括element框架的teble表格的数据展示由横向转向竖向使用实例、应用技巧、基本知识点总结和需要注意事项,具有一定的参考价值,需要的朋友可以参考一下。实现效果:其中左侧和上测是固定内容"table_div">"{bottomOffset:85}"height="100px":data="tableData"stripestyle="width:100%"borderrow-key="index"@cell-click

vue3.0父级组件调用子组件方法

vue3.0父级组件调用子组件方法场景:在页面开发过程中,我经常涉及到不同组件之间的元素和方法的调用。就此记录在vue3.0项目,也是我开发的开源项目中的实现方式。父级组件调用子级1.应用场景以下以我的代码实现为例:在左侧菜单中,通过点击新建会话,在会话列表中新建一个会话框。其中:会话列表页面是菜单的子级组件。2.添加组件引用代码如下:importListfrom'./List.vue'3.页面嵌入代码:这里,在元素中使用ref属性,表示引用一个名为"ListComp"的组件或对象4.使用list中方法(核心)代码如下constListComp=ref(null)//将类型设置为允许为null

vue项目中,动态src引入图片,并且js根据文件名后缀,判断文件图片、视频、文档、pdf等类型的方法

vue根据文件地址,获取后缀,根据后缀判断类型,然后根据类型动态展示不同类型的照片1、处理后缀,根据后缀判断类型 matchType(fileName){//后缀获取varsuffix=''//获取类型结果varresult=''try{varflieArr=fileName.split('.')suffix=flieArr[flieArr.length-1]}catch(err){suffix=''}//图片格式varimglist=['png','jpg','jpeg','bmp','gif'];//进行图片匹配result=imglist.some(function(item){retu

vue项目设置打包后的静态文件访问路径

vue项目设置打包后的静态文件访问路径**啰嗦一下:**相同域名下可能会存在两份相关或不相关的代码,需要通过切换文件夹路径进入不同项目时,需要在项目打包输出代码时设置静态文件的访问路径(vue、react都要)。这种方式可能不太好,但是确实存在这种场景。**静态文件访问路径说明:**项目的静态文件访问路径在本地运行和服务器访问是有区别的,默认状态下服务器上的项目代码,访问路径是从服务器根目录开始。**H5中的访问设置:**在H5中,静态文件访问路径的区别1、服务器根目录访问:代码中书写静态文件路径时开头不加“./”。2、访问当前文件夹:代码中书写静态文件路径时加“./”。vue项目的静态文件访

事件监听 & 页面滚动(页面滚动到某一位置时显示/隐藏某元素,Vue环境)

目录一、效果展示二、实现步骤三、涉及要点1.Vue语法v-show2.获取窗口到元素顶端的距离3.监听事件一、效果展示        最近在做项目时有一个网页渲染是这样的,某一个元素在开始不显示,只有当页面滑动到指定的位置时才显示该元素。效果如下:二、实现步骤1.创建元素并设置为固定定位。2.首先使用Vue中的显示隐藏指令v-show将需要操作的元素隐藏;3.methods中创建监听窗口滚动方法,通过判断元素最顶端与页面最顶端的距离决定是否显示;//监听窗口滚动windowScrollListener(){//获取操作元素最顶端到页面顶端的垂直距离varscrollTop=document.b

小程序隐私信息授权wx.onNeedPrivacyAuthorization vue2+uniapp / vue3

记录一下微信隐私信息授权接口相关配置使用。小程序是uniapp+vue2开发1.首先需要去到微信公众平台,申请小程序中用到的所有隐私接口。可参考用户隐私保护指引填写说明|微信开放文档小程序用户隐私保护指引内容介绍|微信开放文档在这里配置和查看需要申请的接口。2.需要在manifest.json中配置"__usePrivacyCheck__":true,正式开始使用的时候不配置也是可以的。​​3.封装一个组件方便后续在每一个用到隐私接口的页面中引入使用 其中uniapp中注意button上使用的是@agreeprivacyauthorization来触发隐私授权方法

Element-UI官方文档阅读笔记(VUE)—持续更新中····

前言:本人前端新手一枚,目前工作中接触Element-UI较多,但其中很多组件布局什么的都不是很清楚。所以想稍微花点时间简单过一遍Element-UI官方文档,并作以记录。其中有什么不对的地方,还请各位路过的大佬不吝赐教!以下内容按element-ui官方文档结构进行整理一、Basic(一)、Layout(布局)Layout布局主要使用el-row和el-col来实现,然后通过其对应的各种属性来设置所需的各种样式。el-row:一行的内容都放在el-row标签里面,在行标签上可以设置各种属性,如行内各列之间距离等el-col:el-col是el-row的子标签,表示一行里面的每一列。在每一列里