方法一：

import logo from './assets/logo.png'

方法二：

data(){
    return{
        logo:require("./assets/logo.png")
    }
}

1.引入子组件

import 自定义名字 from '子组件路径'

2.注册子组件

 components:{
            使用名字:引入子组件的自定义名字
        }

3.使用子组件

<name></name>

完整示例

<template>
    <div>
        <h1>当前组件</h1>
        <name></name>
    </div>
</template>

<script>
import HelloWord from './components/HelloWorld.vue'
    export default {
        components:{
            name:HelloWord
        }
    }
</script>

1.全局安装vue-cli

yarn global add @vue/cli

2.创建项目

vue create 名称

3.进入项目目录/启动项目

yarn serve

npm run serve

1.在state定义空数组

  state: {
    goodsList:[],//商品列表
  },

2.在 mutations里面写更新数据方法,payload 是传递过来的值，赋值给state下面的goodsList数组

  mutations: {
    // 存储商品
    addGoods(state,payload){
      state.goodsList=payload
    }
  },

3.吧获取到的数据传递给vuex 用this.$store.commit方法传递数据

// 把获取到的数据传递给vuex
        this.$store.commit('addGoods',res.data.data)

4.在从computed里面读取存vuex储的数据

    computed:{
        // 从vuex里面读取商品数据
        list(){
        return  this.$store.state.goodsList
        }
    }

1.创建子组件

components/ListUl.vue

2.父组件引入子组件

    components: {
        ListUl: () => import('@/components/ListUl.vue')
    },

3.父组件中使用

<list-ul></list-ul>

4.父组件传值

<list-ul :sum="list" ></list-ul>

5.子组件接收参数

export default {
    props: ["sum"], // 接收父组件传递的参数
}

6.子组件使用参数

    <ul>
        <li v-for="(v, i) in sum" :key="i">
        </li>
    </ul>

格式：年-月-日 时：分：秒

Vue.filter("datetime", (d) => {
    let d1 = new Date(d);
    let year = d1.getFullYear();//年
    let month = ("0" + (d1.getMonth() + 1)).slice(-2);//月
    let day = ("0" + d1.getDate()).slice(-2);//日
    let hour = ("0" + d1.getHours()).slice(-2);//时
    let minute = ("0" + d1.getMinutes()).slice(-2);//分
    let second = ("0" + d1.getSeconds()).slice(-2);//秒

    // 格式化输出
    return (
        year + "-" + month + "-" + day + " " + hour + ":" + minute + ":" + second
    );
});

在vue中使用echarts图表，窗口收缩图表不自适应解决办法

在绘制图表下添加：

  window.onresize=function(){
            myChart.resize()
        }

离开页面的时候销毁resize事件

destroyed(){
        window.onresize=null//组件销毁时去除resize事件
    }

1.设置总线，在main.js中

// 设置一个总线，用于组件之间传递参数
Vue.prototype.$bus = new Vue()

2.需要传数据出去的组件

            // 传递参数
            this.$bus.$emit("sendImg", res.imgUrl);

3.接收数据的组件

         // 接收参数
        this.$bus.$on('sendImg',(url)=>{
            this.imgUrl=url
        })