使用封装的分页组件或element-ui分页组件删除当前页最后一条数据没有跳转到上一页显示暂无数据的问题
解决方案1:
// 删除当前页面最后一条数据后之前数据不显示
//pConfig是我的分页组件 table是我的列表
let totalPage = Math.ceil(
this.$refs.table.totaled / this.$refs.table.pConfig.pageSize
)
let pageNum =
this.$refs.table.pConfig.pageNum > totalPage
? totalPage
: this.$refs.table.pConfig.pageNum
this.$refs.table.pConfig.pageNum = pageNum < 1 ? 1 : pageNum
//手动跳转为方式一
解决方案2:
分页组件中v-show和v-if的使用导致
-
key值为index导致删除功能出问题:
数组的key值,尽量不要用index,尤其是有删除功能的时候,这样会出问题:
index是区分数组里的每一个子元素的,用index作为key值,在删除的时候,比如删除了第一项,但是后续index改变,为0的是其它子元素(导致删除的可能是第二个子元素),(就是说index随着数组长度改变而改变,不像id之类的不会随之改变) -
思考问题的时候,多换个思路思考,比如安装代码失败,有版本号的话,直接复制版本号放到package.json文件里面,再install一下,不要一直死扣为什么下载不了,命令行是哪的问题,换个角度思路,能够很快的解决问题!
-
git报错 报错显示,git的一个swp后缀名文件已经存在导致的报错,简单快速解决方案是删除该交换文件:rm .git/.COMMIT_EDITMSG.swp
参考链接:http://www.voidcn.com/article/p-nhueqgyz-bwh.html
参考链接:https://blog.csdn.net/qq_32452623/article/details/78395832 -
input输入框在IOS手机上,由于placeholder字体小于输入框字体,导致placeholder字体偏上显示。
解决方案:placeholder属性,设置line-height: normal; padding-top: 0.4rem(2px)。就可以。
类似支付宝还花呗-提前还款页面。input输入框问题。
input::-webkit-input-placeholder
padding-top .4rem
line-height normal
注意:父级元素不要设置diaplay: flex属性。更不要设置align-items为baseline,显示会出问题 -
组件注册命名出错。(首字母必须大写命名!!!)
参考链接:
https://cn.vuejs.org/v2/guide/components-registration.html(官方文档)
https://blog.csdn.net/soul7y/article/details/108508657(报错解决博客)
组件命名有两种方式:
1.使用 kebab-case;2.使用 PascalCase(首字母大写命名)
报错原因:组件命名时候 写成了:msgPushCenter,没有大写。
报错内容:msgPushCenter is not PascalCase。
改成:MsgPushCenter就好了。
没事了多看文档,文档上好多细节都不知道! -
a标签如果导入的href,是第三方链接,或者前后端分离的后端接口,那么download属性将不会生效。
-
对于按钮设置为router-link包裹的,按钮禁用,router-link也不允许要跳转的话,设置pointer-events:none
它的作用是阻止用户的点击产生任何效果。
router-link(:class=“{ ‘stopclick’: ‘变量’/scope.row.status === 1 }”)
-
select改为多选属性,onchange事件报错
报错内容:Invalid prop: type check failed for prop “value”. Expected String, Number, got Array。
原因:relateuserCount在该change事件中有赋值,该属性本身是string类型,prop也是该属性。但是现在复制强制改成数组类型,但是prop并不支持prop为数组类型,prop对应值只能是string或者number。导致报错。 -
select 多选、远程搜索都有,参考官方示例。
如果el-option是v-for循环出来的,需要指定key,并且key值具有唯一性,不能使用index,会出问题。
如果想保留搜索结果,加reserve-keyword属性,(多选且可搜索时,是否在选中一个选项后保留当前的搜索关键词)。 -
接口401导致频繁跳登陆页
可能接口未配置网关 也可能账号有问题 并非当前环境对应的账号密码 导致登陆不上去 -
字符串前面加了个+号
JS中一个字符串中只有数字,如果该字符串前面加了个加号,这个数值就变成了number类型。 -
超好用的选择器
p标签下的奇数行与偶数行
p:nth-child(odd){} //奇数行
p:nth-child(even){} //偶数行
:last-child最后一个子元素
:nth-child(n) 选择器匹配属于其父元素的第 N 个子元素,不论元素的类型。 -
子传父清晰图解
-
封装个垂直水平局中
allCenter()
position absolute
top 50%
left 50%
transform: translateX(-50%) translateY(-50%)
设置特定宽高
width:calc(100% - 300px); -
pre和jira上的代码有冲突
git fetch vfe
git checkout pre-common
git pull
git merge 本地分支
git add .
git commit -m ‘合并pre’
git push -
vue的is怎么用
is
可以直接传递一个组件
:is
是查找父组件中的一个赋值,然后找到相应的组件
** -
git 需要fork库时常用操作
删除远程分支: git push origin --delete [branchname]
删除本地分支:git branch -d
合并commit :
- rebase -i HEAD~3
( 删除不需要的commit。要保留第一个commit 否则会报错) - git rebase —continue 然后编辑要保存的commmit 最后强制推送,每一次解决完冲突都要使用 git rebase --continue
- 按照VIM操作)按ESC键 再按 shift + : 然后输入wq(w是保存,q是退出) 按回车键。 保存: :wq 不保存: q!
小提示:
查看远程仓库地址:git remote -v
撤销上一次的git commit 把暂存放到修改
git reset --soft HEAD~把暂存放到修改
查看主库和自己的仓库地址:
git remote -vv
查看是否符合eslint规范
npm run lint
配置: 找到hosts 文件进行编辑
127.0.0.1 suuibian.vipkid-qa.com.cn
本地启动项目就用suibian.vipkid-qa.com.cn
加端口号访问
-
pre和jira上的代码有冲突
git fetch 远程仓库别名
git checkout pre分支名
git pull
git merge 本地分支
git add .
git commit -m ‘合并pre’
git push -
fork库进行开发流程
git fetch 远程仓库别名
git rebase 远程仓库别名 /master
git push -f
git checkout -b dev
git commit -m ‘xxx’
git push (用git 提示的提交)
git add xxx
git commit --amend
git push -f 本地分支名:远程仓库分支名(强制提交到自己的远程仓库的分支)
开发完了,需要提测。(需要过新代码检查,所以要合最新的远程仓库的master)
git checkout master->git fetch 远程仓库别名 ->git rebase 远程仓库别名/master->git push -f(保证你的fork的库是最新的)-》git checkout dev -> git merge master->git push -f -
想要本地和远程之间有互动
git init
当在本地克隆好一个项目之后,想要本地和远程之间有互动第一步就是要初始化本地仓库。git init就是完成这件事情,创建一个空的git仓库或者重新初始化一个现有的仓库。
执行git init之后会生成.git的目录,该目录下有branches, hooks,info,objects,refs目录和config, description,HEAD文件。 -
npm遇到的问题
安装某个依赖安装不上 升级node版本 -
缩小字体
如何实现小于12px的字体效果(transform: scale( )缩小元素) -
不需要走eslint规范的代码
这个报错 或者手机页面白屏可以 npm run bulid 从新打包一下 因为有的es6没有转为es5
- vue通过下标取值的时候有可能会出现报错。图片可以渲染出来,但是页面会报错。
原因是渲染速度的问题,刚进来的时候html先渲染,list[0].coverPath 就是undefined啊,
针对这一个解决办法,可以给父标签一个 v-if=“list[0]” ,等有这个元素后才显示,就不会报错了。
前端提测的时候,如果项目涉及new Date()的方法,一定要同步测试增加时区测试
持续更新中…