javascript - What is the difference between writing a component and writing a plug-in in vue?

Question

Now I want to write a paging thing, but I am not sure whether it is better to write it as a .vue single file or use install to write it as a plug-in. I am not sure about the difference between the two. I feel that .vue can solve the demand, but why Is there a way to install? There is also a question about installing and writing plug-ins

//pagetion的模版
    <template>
      <p class="paging">
        <p name="pagingPage">
          <li>
            <span class="paging-first"></span>
          </li>
          <li v-for="item in numArr">
            <span class="paging-next">{{item}}</span>
          </li>
          <li>
            <span class="paging-last"></span>
          </li>
        </p>
       </p>
    </template>
    

    //这个是install写插件
    let paging = {
      install: function(Vue, options) {
        Vue.component('pagination',pagination);
      }
    }
    
    

How do I pass the options configuration parameters in my install to the pagetion template?

Answer 1

Vue’s components are a combination of templates and UI logic.

If the paging logic needs to be reused among many components, then the best way is obviously to reuse the JS logic of the Vue file through a plug-in.

If the paging logic is only used in one component, then using plugins and mixins will reduce the readability of a single Vue component.

Answer 2

A Vue plug-in can be a collection of Vue components (what the plug-in does is to help you pour the internal components into the Vue global), or it can be used to extend Vue functions, such as Vuex, Vue-Router. You can also write a plug-in to extend methods on the Vue prototype. To achieve this requirement, there is absolutely no way to write it as a component.

 let whatever = {
      install: function(Vue, options) {
        Vue.prototype.$whatever = function(){
          // do something 
        };
      }
    }
    
// 你这个用组件咋搞？

In addition, why do you need to decide the data of the components that the plug-in pours when installing the plug-in? Shouldn't you control it through props when using this component?