- 博客(113)
- 问答 (1)
- 收藏
- 关注
原创 文本不换行,多余的内容显示省略
/**有时候经常会在一些提示标题中或者表单 、表格中用到,或者实现一个留言效果的时候,可以像微信一样当字数多得时候使用省略号来隐藏部分内容,当我要看全文的时候,点击查看讲内容全部展开,具体方法就不说了,下面给大家两种实现文本不换行,多余的显示省略号得代码 两种有时候有着不同的用途,具体使用方法就不多说了**/<!doctype html><html lan...
2019-10-24 18:08:37 4896
原创 vue 动态添加类名获取数组中的内容并且需要点击的选中样式类名,
最近在项目中遇到一个问题,一个选择需要一个固定的类名提供公共样式,一个类名来判定显示 那个颜色的,另一个类名判定是否是选中状态,思考了很久,网上找了很久,终于让我写了出来,一起看代码吧!!!!<template> <div style="margin-top: 30px;" class="newAddPop controlFuzzy"> &...
2019-08-03 11:09:49 2476 1
原创 element Table 样式行错位
有时候项目中需要对table样式和滚动条样式进行调整,会导致原本完好的表格出现样式问题,当数据多的时候,左右还有定位设置了fixed的情况 ,页面出现横向竖向的滚动条,就会出现行错位。
2024-11-15 08:57:39 136 1
原创 对数据的一些处理
1.将一个值赋值给另一个值,也可以都是一个值,可以在复杂的数据结构中让数据更新或者页面渲染有反应。2.或者是使用笨方法,尤其是一些特殊情况需要对数据进行处理但是不能影响原先数据的情况下。3.将两个对象进行整合,要注意顺序,相同的情况是要用哪个对象里面的。4.当我们需要判断一个对象中是否有某个字段的时候。5.当我们想获取某个数据中符合条件的数据。
2024-09-03 11:20:25 179
原创 查找数据中相同的id并赋值一个相同的值,不同的累加
后台给的数据中有相同的一个id,需要通过判断来查找相同的id给所有相同添加一个属性比如 index:1,当第二个相同的数据添加 index:2,以此类推。首先第一步:我们需要把数据进行整理把所有相同id的放到一起,这样页面渲染上相同规整到一起,而且如果是表格还方便做合并。第二步:通过相同的id给每个数据添加我们需要的。
2024-09-03 09:31:03 226
原创 textarea 中的内容在word中显示换行不起作用
在JavaScript中,处理文本换行以确保它在Word中正确显示,通常需要将文本中的换行符转换为Word可识别的格式。在HTML中,换行通常是通过。标签来实现的,而在Word中,换行通常由段落标签。js文本换行在word显示。
2024-06-14 17:08:12 383 1
原创 对象格式的数据表单循环校验
换个思路如果前端页面遇到需要展示的内容是可以循环展示的,但是后台的数据不是数组形式的,我们就可以用这样的方式灵活处理。首先我们的代码数据是这样的(直接和后台对应)
2024-06-04 09:16:32 284
原创 事件穿透效果
讲述一下事件穿透的需求,大家可以根据实际情况来考虑是否采用这种方式来制作页面,(项目中遇到了底部是地图,两侧面板,但是UI在设计的时候为了好看,会有很大的遮罩阴影部分,如果按照时间制作会导致地图可点击的区域变得很小,这个时候就考虑了使用事件穿透,即按照效果图还原了页面,也不影响地图操作),我们来看案例。完成,具体效果可以拿到自己项目中去实验一下,通过点击事件的操作来观察具体细节!按图上样式来组件化,每次我们只需管左右两侧的内容就可以了。
2024-03-28 17:03:04 612
原创 vscode如何快速生成想要的vue格式代码
vue + tab键我也想让它生成我想要的格式代码,比方说经常用一些方法,生命周期,或者样式类型(less scss)文件-> 首选项->配置用户代码片段 (点了之后可能会让github登录我的登录密码忘了就直接点了之后它显示了一个框)+ tab键会生成标准的html格式代码。然后找到vue.json。
2023-11-02 17:16:25 523
原创 封装的方法固定的参数,特殊环境下需要多带参数
组件封装的时候某些方法回传出去某些参数,但是特殊条件下需要将其他参数也一并带入方法中使用。比如图片中的方法就可以实现不影响自带的参数,也不影响我们需要多带的参数。
2023-10-17 15:16:48 193
原创 vue中bus的使用和涉及到的问题
那么当有多个同类型或者部分需要显示隐藏时就会发现,接收的方法一直在调用,但是使用bus.$off("info")是不对的,bus是一个全局的,如果销毁回事页面的其他功能不可用。正常的通讯上面就已经完成了,但是还有一个问题那就是如果接受的页面不存在了,还是会继续执行bus.$on,所以我们需要再不需要的时候或者页面销毁时将bus销毁。不可能点击一个定义一个方法,详情接受所有方法, 只能是都是用一个方法然后通过传递特定的标识来进行处理!bus还有很多很多坑需要我们去注意,所以谨慎使用bus,暂时就介绍这么多!
2023-08-28 15:19:54 751 2
原创 点击菜单内容显示对应区域,滚动菜单也变化
以前写过一个案例,终于用到了项目中,这个是升级版考虑了点击的时候内容要显示对应的区域,内容区域滚动的时候菜单也会随着变化<template> <div class="box"> <div class="menu"> <ul> <li v-for="(item, index) in list" :key="index" :class="{ ac
2023-04-22 17:18:58 406
原创 vue 自定义组件npm上传
第四步npmaddcddp-ui/npmupdatecddp-ui下载或更新自己创建得组件库cddp-ui。第三步npmpublish发布到自己得npm账户。第二步npmlogin登录自己的npm账户。第一步创建自己的npm账户。
2022-07-28 10:38:01 285
原创 vue element表格默认选中表格第一行
获取数据后添加下面得代码this.$nextTick(()=>{this.$refs.myTable.setCurrentRow(this.baseDataList[0])})
2022-05-17 11:17:41 5198 2
转载 css不换行
// 强制不换行p{ white-space:nowrap;}// 自动换行p{ word-wrap: break-word; word-break: normal;}// 强制英文单词断行p{ word-break:break-all; //*注意:设置强制将英文单词断行,需要将行内元素设置为块级元素。 }设置强行换行:word-break:normal ; //依照亚洲语言和非亚洲语言的文本规则,允许在字内换行break-all : /.
2022-03-22 14:50:21 2909
原创 vue中有些时候需要存cookie然后改变了要监听
main.js// 自定义监听sessionStorage的方法Vue.prototype.$addStorageEvent = function (type, key, data) { if (type === 'setItem') { //type为setItem时执行下面的方法 // 创建一个StorageEvent事件 var newStorageEvent = document.createEvent('StorageEvent'); const stor.
2022-03-21 15:30:00 3847
原创 系统头部日期时间和星期
//判断是否在前面加0 getNow(s) { return s < 10 ? "0" + s : s; }, headerTimeFn() { let myDate = new Date(); let year = myDate.getFullYear(); //获取当前年 let month = myDate.getMonth() + 1; //获取当前月 let date = myDate.getDate(..
2022-02-23 15:29:46 736
原创 css 控制图片的亮度
一个图片做的原有的图片基础上高亮相当于多了一个状态,可以再ui没有给hover状态时可以用它来代替可以省去引入图片的麻烦,-webkit-filter: brightness(150%);filter: brightness(150%);
2022-02-10 10:18:55 1766
原创 页面需要做一定的倾斜效果
左侧: transform: perspective(150px) rotateY(2deg);右侧:transform: perspective(150px) rotateY(-2deg);底部: transform: perspective(150px) rotateX(9deg);
2022-01-25 15:45:55 810
原创 vue echart写法组件案例
<template> <div class="chartPart" style="width: 100%; height: 100%"></div></template><script>import echarts from "echarts";export default { props: ["chartData"], watch: { chartData: { deep: true, h.
2021-09-26 14:19:35 216
空空如也
浏览器f12检查vue页面开发代码无法正常查看
2022-05-06
TA创建的收藏夹 TA关注的收藏夹
TA关注的人