# useElementUi

**Repository Path**: doen/useElementUi

## Basic Information

- **Project Name**: useElementUi
- **Description**: element ui 的使用
- **Primary Language**: Unknown
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 1
- **Forks**: 0
- **Created**: 2020-05-05
- **Last Updated**: 2023-02-13

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# useElementUi

## 开发环境下

- slot 插槽的使用，代码中的位置

  - tom 组件，sibliingPassValue 界面中。

  - ```vue
    <!-- sibliingPassValue界面 -->
    <tom>
      <div slot="header">
        <p>头部内容</p>
        <p>导航栏</p>
      </div>
    
      <div slot="footer">
        <p>底部内容</p>
        <p>联系方式</p>
      </div>
    </tom>
    <!-- tom组件 -->
    <slot name="footer"></slot>
    <div>我是tom</div>
    <slot name="header"></slot>
    ```

- 兄弟组件之间互通

  - 事件中心的方式实现

  - ```vue
    <!-- 1.创建一个具有Vue实例的.js文件 -->

    <script>
    	// 2.在两个兄弟组件中导入
    	import Eh from '../eventHub.js';
    	export default {
    	  data() {
    	    return {
    	      increase: 3
    	    }
    	  },
    	  methods() {
    	    handle() {
    	      // 4.触发事件
    	      Eh.$emit('eventJerry',this.increase)
    	    }
    	  },
    	  mounted() {
    	    <!-- 3.写监听事件 -->
    	      Eh.$on('eventTom', (val) =>{
    	    	// 拿到另一个组件传过来的值了。val
    	    })
    	  },
    	}
    </script>

    <!---->
    <!---->
    ```