【愚公系列】2022年04月 Python教学课程 78-VUE组件中的数据和属性

• 前言
• 一、数据的绑定
• • 1.数据绑定
• 二、组件的使用
• • 1.全局组件和局部组件
• 三、组件传值

因为是Python系列只是简单介绍VUE的基本使用。

组件是Vue中的一个重要概念，是一个可以重复使用的Vue实例，它拥有独一无二的组件名称，它可以扩展HTML元素，以组件名称的方式作为自定义的HTML标签。因为组件是可复用的Vue实例，所以它们与new Vue（）接收相同的选项，例如data，computed、watch、methods以及生命周期钩子等。仅有的例外是像el这样根实例特有的选项。

把一些公共的模块抽取出来，然后写成单独的的工具组件或者页面，在需要的页面中就直接引入即可。那么我们可以将其抽出为一个组件进行复用。

例如 页面头部、侧边、内容区，尾部，上传图片，等多个页面要用到一样的就可以做成组件，提高了代码的复用率。

在vue中数据通过data属性进行绑定，如下：

    
    
    
    
    


    


        {{name}}
    
 

父组件给子组件传值，组件中通过props属性传递数据，如下：

子组件给父组件传值，通过$emi将数据传递个父组件