el-pagination修改默认的文字“前往”(记录一下)

问题描述

饿了么自带的分页组件,提供的跳转到某一页的文案是 “前往”,如下图所示
el-pagination修改默认的文字“前往”(记录一下)_第1张图片
不过有时候我们想要换一个文案,但是看了一下官方文档,分页组件没有提供默认的修改文字的插槽
el-pagination修改默认的文字“前往”(记录一下)_第2张图片

解决方案

咋办呢?可以通过js的方式获取对应的DOM元素,然后修改其对应的值。我们先审查一下元素
el-pagination修改默认的文字“前往”(记录一下)_第3张图片
找到元素了,类名为 el-pagination__jump
这样的话,我们就可以在页面初始化渲染的时候,去修改其内容。代码如下:

 mounted() {
    document.getElementsByClassName("el-pagination__jump")[0].childNodes[0].nodeValue = "跳转";
  },

最终效果

image

总结

当遇到组件解决不了的问题的时候,可以考虑使用原生js去实现对应的效果。

原生js效果真强大!

你可能感兴趣的:(el-pagination修改默认的文字“前往”(记录一下))