vue项目--模拟在地址栏拼接字符串然后在从地址中截取该字符串

最新推荐文章于 2023-07-25 11:21:16 发布

艺逸&福兜

最新推荐文章于 2023-07-25 11:21:16 发布

阅读量935

点赞数

文章标签： vue.js

本文链接：https://blog.csdn.net/lxuanz/article/details/108343914

版权

<template>
    <div>
        <div class="banner"><img src="./../../assets/images/banner.png"/></div>
        <div class="nav">
            <ul>
                <li>
                    <a @click="$router.push('/moreMedicine')"><img src="./../../assets/images/nav_01.jpg"/><p>每日特惠</p></a>                   
                </li>
                 <li>
                    <a @click="$router.push('/moreSeckill')"><img src="./../../assets/images/nav_02.jpg"/><p>健康精选</p></a>
                </li>
                 <li>
                    <a @click="$router.push('/morePing')"><img src="./../../assets/images/nav_03.jpg"/><p>网红爆款</p></a>
                </li>
                 <li>
                    <a @click="$router.push('/moreWeek')"><img src="./../../assets/images/nav_04.jpg"/><p>经典好药</p></a>
                </li>
            </ul>
        </div>
       
        <columns :dataShow="lists"  :cardCode="cardCode"></columns>
    </div>
</template>

<script>
import columns from './../../components/shared/columns.vue'
import GoodLists from './../../assets/goodslist.json'
export default {
    name: 'Home',
    components:{
        columns
    },
    data () {
        return {
            lists: [],           
            cardCode:'' 
        }
    },
    created () {       
        this.lists = GoodLists.data,
        window.history.pushState(null,null,'?cardeCode=5281090800011454');//在地址栏中拼接字符串

    },
    methods: {  
    },
    mounted(){//获取地址栏中的字符串
        var searchURL= window.location.search
        var searchURL = searchURL.substring(1, searchURL.length);
        this.cardCode = searchURL.split("?")[0].split("=")[1]
        console.log(this.cardCode) 
    }
}

</script>