leah-xx

摘要： 对于未知高度的盒子，如何实现展开收起的transition过渡效果 我们经常碰到一种情况，点击某个按钮需要对某个盒子的内容进行展开收起，很多时候我们会用display:none | block;实现其内容的出现和消失。但这个办法做出来的视觉效果很生硬，这时候我们就想用transition做过渡动画的 阅读全文

摘要： 今天说一个在移动端可移动浮标按钮的react实现 中心思想就是利用浮标的left、top样式来控制浮标移动。 HTML代码： <div id="ballId" onTouchStart={(e) => { e.stopPropagation(); }} onTouchMove={(e) => { e 阅读全文

摘要： 这两天碰到一个场景，需要做一个动态背景，在web端，ios端，android端呈现相同的效果——就是要动起来。 上面这个问题看起来很简单，实操起来却碰到了一些意外的困难。首先是设计师提供的“动图”是个视频，就是mp4。我要求过给个gif，但得到的回复是转gif文件会很大，且不清晰。由于gif文件过大 阅读全文

摘要： 最近在开发项目时发现，在移动端input里面的placeholder字体偏下，但PC端却是垂直居中，而两者的代码几乎相同，只是字体大小有差异，查询发现原来就是它惹的祸。 原因： 输入的文字font-size大于placeholder的font-size。 当时我的代码中PC端与移动端的font-si 阅读全文

摘要： 现象： 今天在写react的时候发现一个奇怪的现象，每次我点击按钮之后，数据会更新，接着页面也刷新了，导致我更新的数据回到初始化状态（因为data数据存在state里面，所以页面刷新，data也会重新初始化）。 原因： button写在form表单里面，form表单提交会默认刷新页面。 <form> 阅读全文

摘要： 报错：Cannot read properties of undefined (reading 'props') 原因：点击按钮调用父组件的add方法控制台报错，错误发生在子向父传值（子组件修改父组件的值）的过程中。是this指向不正确导致。 错误代码： 子组件代码 这里发现this打印出来是und 阅读全文

摘要： 报错：no such file or directory 解决：删除node_modules文件夹，重新安装（npm i / anpm i） 阅读全文

摘要： chrome中input默认样式 - border-style ：inset 今天在自定义input样式的时候发现，chrome浏览器下input的上和左边框像有阴影一样，跟另外两个边框不太一样，最后排查发现是border-style:inset的问题，这是个3D样式效果，只需要修改为：border 阅读全文

摘要： 写过scss和css的都知道，scss可以嵌套样式选择器，感觉更符合写代码的逻辑和思维。所以我也是更愿意在项目里引用scss的。下面简单介绍下引入的步骤和引入踩的坑。 引入步骤 1、安装node-sass、sass-loader npm i node-sass@4 sass-loader@10 -d 阅读全文

摘要： 报错： error 'v-model' directives require no argument 原因： 这是ESLint对vetur进行了eslint检查，vetur插件的作者给出了解决办法： 我们可以把eslint对该插件的检查关闭 解决： 修改settings.json ： 参考： htt 阅读全文