帮我编写一个购物平台前台头部导航栏利用到element-ui

下面是一个使用element-ui编写的购物平台前台头部导航栏的示例代码：

<template>
  <div>
    <el-menu mode="horizontal" :default-active="activeIndex" class="header-menu">
      <el-menu-item index="home">
        <router-link to="/">首页</router-link>
      </el-menu-item>
      <el-menu-item index="products">
        <router-link to="/products">商品</router-link>
      </el-menu-item>
      <el-menu-item index="cart">
        <router-link to="/cart">购物车</router-link>
      </el-menu-item>
      <el-menu-item index="orders">
        <router-link to="/orders">订单</router-link>
      </el-menu-item>
    </el-menu>
  </div>
</template>

<script>
export default {
  data() {
    return {
      activeIndex: 'home'
    };
  }
};
</script>

<style scoped>
.header-menu {
  margin-bottom: 20px;
}
</style>

在这个例子中，我们使用了el-menu组件来创建导航栏，mode属性设置为horizontal表示水平布局。每个菜单项使用el-menu-item组件来创建，index属性用于标识菜单项。我们使用router-link组件来创建导航链接，to属性指定了路由路径。

你可以根据自己的需求修改菜单项的链接和文本。同时，你还可以根据需要自定义导航栏的样式，比如修改菜单栏的颜色、字体样式等