干货
努力向前,成长可见
这个作者很懒,什么都没留下…
展开
-
元素开启绝对定位后点击事件失效解决办法
元素开启定位后点击事件失效是因为被上层元素遮挡,点击到的元素此时不是绑定了事件的元素,解决的办法是提升该元素的层级position: absolute;z-index: 99;原创 2021-02-09 13:03:00 · 3696 阅读 · 0 评论 -
vue中父组件异步获取的数据传给子组件可能会遇到的坑
今天在项目开发中遇到了一个问题,父组件异步获取的数据传给子组件,子组件对传过来的该数据进行处理后显示,但是却无法显示处理之后的数据。经过我不停的尝试,我发现了一个奇怪的问题,当我刷新页面时,本来希望在子组件中显示出来的数据却不能显示出来,但是我对子组件的代码加一些无用的代码执行保存此时数据竟然神奇的出现了,我对这个问题又是无奈又是好奇,于是查询了各种资料,终于把这个问题解决了,现在把它分享出来,希望对大家有一点帮助。对于这个问题,我进行了两种尝试,首先第一种:先把代码放上来然后慢慢说mounted(原创 2020-12-31 09:58:30 · 1983 阅读 · 0 评论 -
echarts5版本引入报错“export ‘default‘ (imported as ‘echarts‘) was not found in ‘echarts‘
这是因为echarts5用的是commonjs的模块,引入方式改成var echarts = require(‘echarts’);即可当然你也可以使用import方式引入5.0以前的版本原创 2020-12-29 21:01:47 · 1623 阅读 · 1 评论 -
table的tr间距问题
灵活控制tr的间距是我们在项目开发的过程中经常会遇到的问题,比如让tr之间是固定的间距,单元格(即td)合并。第一反应可能是使用外边距来控制,但是tr对padding的设置是有用的,而对于margin的设置是不起作用的。你可能会想是不是可以用display: block来将tr变成块元素,再设置块元素的外边距,但是这样就失去了tr特有的显示效果(此时display的属性为display: table-row),如td的自动对齐,垂直居中等。那么怎么很好的取控制呢,可以通过css中border-colla原创 2020-12-23 09:52:17 · 4075 阅读 · 1 评论 -
伪元素和伪类的区别
伪类和伪元素的根本区别在于:它们是否创造了新的元素。伪元素/伪对象:不存在DOM文档中,是虚拟的元素,是创建新元素。代表某个元素的子元素,这个子元素虽然在逻辑上存在,但却并不实际存在于文档树中。伪类:存在DOM文档中,逻辑上存在但却未进行标识的分类。W3C中对二者进行这样的描述:伪类:用于向某些选择器添加特殊的效果伪元素:用于将特殊的效果添加到某些选择器这两句解释的很到位,你品,你细品~~下边的文章对伪类和伪元素做出了详细的解释,建议阅读链接: 伪元素和伪类的区别总结....转载 2020-12-21 23:13:30 · 133 阅读 · 0 评论 -
使用伪元素给超链接设置自定义下划线
相信你和我一样对如何给超链接设置自定义下划线充满兴趣,如何设置下图这样的下划线呢?废话不多说,下面直接上代码 .nav .router-link-exact-active{ position: relative; } .nav .router-link-exact-active:after{ content: ''; position: absolute; left: 1.25rem; bottom: 0; width: 2.5rem;原创 2020-12-21 22:44:02 · 608 阅读 · 0 评论 -
Vue项目中的Emitted value instead of an instance of Error问题
对于一个初次进行项目开发的小白来说,项目开发的过程中可能会遇到这样的问题:这个警告的意思是用v-for呈现的组件列表需要具有显式键。出现这个警告的原因是在Vue中当使用v-for进行列表渲染时,虚拟dom和实际dom不一样,不能做唯一性,为元素绑定一个key,可以确保唯一性操作。这也是Vue官方推荐的做法。所以,针对上述问题的解决方法:在警告的组件里v-for后面加一个属性key,即为生成的每一个元素绑定一个key,这样就可以了。如下边代码所示: <mt-tab-container v原创 2020-12-21 17:20:42 · 16094 阅读 · 0 评论 -
vue-router子路由的一些注意事项
1.子路由中的name属性和父路由中的name属性不可以同时出现2.使用children属性实现子路由时,子路由path前面 不能带/,以/ 开头的嵌套路径会被当作根路径,否则会永远以根路由开始请求, 这样不方便我们调用渲染数据...原创 2020-12-20 18:38:11 · 407 阅读 · 0 评论 -
Vue组件的命名
组件有好几种命名方式, 可以使用 component-vue (短横线分隔命名)、componentVue (驼峰式命名) 或ComponentVue (单词首字母)因为html对大小写不敏感, 所以在调用的时候驼峰命名的都要写成短线分割形式:以上三种都要写成小写短线这种形式:<component-vue></component-vue>...原创 2020-12-20 16:03:49 · 454 阅读 · 0 评论 -
使用import引入组件的注意事项
Vue使用import … from …来导入组件,库,变量等。而from后的来源可以是js,vue,json。这个是在webpack.base.conf.js中设置的: resolve: { extensions: ['.js', '.vue', '.json'], alias: { 'vue$': 'vue/dist/vue.esm.js', '@': resolve('src'), } },这里的extensions指定了from后可导入的文原创 2020-12-20 15:17:20 · 1388 阅读 · 0 评论 -
文本自适应居中
文本自适应居中多行文本和图片在未知尺寸的容器中的居中方法多行文本和图片在未知尺寸的容器中的居中方法1、position:absolute;1 当元素没有宽和高的时候,设置四个方向的定位值可以把元素宽高拉开,撑满父级;2 当元素有宽高的时候,设置四个方向的定位值为0,可以使用margin:auto;居中。2、margin:0 auto;左右居中3、定位居中父级设置position:relative;子级设置position:absolute;top:50%;left:50%;margi原创 2020-11-10 08:56:27 · 430 阅读 · 1 评论