vue公共组件封装

vue公共组件封装
公共组件专门放在一个文件夹下。
公共组件写法就是写组件
注册组件，使用的话需要引入组件文件然后传值调方法获取值传值。
传值就是父子组件传值方法

为什么可以使用父子组件传值的方法
看似公共组件和使用组件的文件，不是直观的父子级目录的文件，好像不能使用父子组件传值方法。实际上父子组件是相对来说的，组件文件的template里写的组件相对于这个文件是子组件，对于使用组件的文件，引用组件相对于该文件是子组件。

封装了个分页练手，代码仅实现了简单功能，但写的很垃圾，优化的代码忘保存截图了。之后有时间再写遍更新。
实际开发遇到的bug
1、Avoid mutating a prop directly since the value will be overwritten whenever the parent component re-renders. Instead, use a data or computed property based on the prop’s value. Prop being mutated: “total”
翻译：避免直接改变属性，因为当父组件重新呈现时，该值将被覆盖。相反，使用基于属性值的数据或计算属性。道具正在变异：“total”

解决：

  props:{
            total: {
                type: String,
                required: true
            }
        },
 data() {
       return {
             itotal: this.total,
         }

父组件传递过来total，在子组件（封装的公共组件），用props接收，data里创建一个变量接收。

2、Property ‘total’ does not exist on type ‘{ PageCount(total: any): void; }’
类似问题Property ‘xxxx‘ does not exist on type ‘xxx‘
解决：类型不对
我这个是在某一处Number类型变成了String类型，然后在进行加法运算的时候出错。
对该对象进行类型转换即可