Vue项目开发中遇到的问题

<template>
    <div class="topDiv">
        <div class="leftMenu">
            <a-menu
                    style="width: 256px"
                    mode="vertical"
                    @click="handleClick"
            >
                <a-menu-item key="1">
                    <div><img src="@/static/icon/home_icon_order_online.png" class="online" data-src="home_order_online_white.png"><span>在线下单</span></div>
                </a-menu-item>
                <a-menu-item key="2">
                    <div><img src="@/static/icon/home_icon_order.png" class="online" data-src="home_order_white.png"><span>我的订单</span></div>
                </a-menu-item>
                <a-menu-item key="3">
                    <div><img src="@/static/icon/home_icon_wallet.png" class="online" data-src="homen_wallet_white.png"><span>我的钱包</span></div>
                </a-menu-item>
                <a-menu-item key="4">
                    <div><img src="@/static/icon/home_icon_recharge.png" class="online" data-src="home_recharge_white.png"><span>充值中心</span></div>
                </a-menu-item>
                <a-menu-item key="5">
                    <div><img src="@/static/icon/home_icon_address.png" class="online" data-src="home_address_white.png"><span>商户地址</span></div>
                </a-menu-item>
                <a-menu-item key="6">
                    <div><img src="@/static/icon/home_icon_set_up.png" class="online" data-src="home_set_up_white.png"><span>系统设置</span></div>
                </a-menu-item>
            </a-menu>
        </div>
    </div>
</template>

<script>
    export default {
        name: "homeindex",
        methods: {
            handleClick (e) {
                let imgItem = e.item.$el.getElementsByTagName('img')[0];
                // imgItem.src = "../../../../static/icon/"+imgItem.dataset.src
                imgItem.src = require("../../../../static/icon/"+imgItem.dataset.src)
            },
        },
    }
</script>

<style scoped lang="less">
    .topDiv{
        .leftMenu{
            .a-menu{
                .a-menu-item{
                    .online{

                    }

                }

            }

        }
    }

</style>

点击之后,切换导航栏的icon,这时候不能直接写入相对路径,因为这时候资源已经被模块化了,如果需要将所需资源模块化,就需要用require异步引入