构建一个vue项目，内容随意，至少能用到数据绑定，vue组件，vue路由，vuex状态管理等方面的两个或者两个以上内容。

好的，让我来为你演示一个简单的Vue项目。

首先，我们需要使用Vue CLI来创建一个基本的Vue项目。在终端中输入以下命令：

vue create my-project

接着，我们需要安装一些必要的依赖包。在终端中进入项目目录，并输入以下命令：

cd my-project
npm install vue-router vuex

现在我们已经准备好开始构建我们的Vue项目了。我们假设这是一个电子商务网站，我们需要展示商品列表，购物车和订单等信息。让我们从创建一个商品列表开始。

我们在`src`文件夹中创建一个`components`文件夹，并在其中创建一个名为`ProductList.vue`的组件。这个组件将会展示所有的商品信息。我们可以使用`v-for`指令来循环渲染每一个商品，代码如下：

<template>
  <div>
    <h1>Product List</h1>
    <ul>
      <li v-for="product in products" :key="product.id">
        <h2>{{ product.name }}</h2>
        <p>{{ product.description }}</p>
        <button @click="addToCart(product)">Add to Cart</button>
      </li>
    </ul>
  </div>
</template>

<script>
export default {
  data() {
    return {
      products: [
        {
          id: 1,
          name: 'Product 1',
          description: 'This is product 1',
          price: 10.0,
        },
        {
          id: 2,
          name: 'Product 2',
          description: 'This is product 2',
          price: 20.0,
        },
        {
          id: 3,
          name: 'Product 3',
          description: 'This is product 3',
          price: 30.0,
        },
      ],
    };
  },
  methods: {
    addToCart(product) {
      this.$store.commit('addToCart', product);
    },
  },
};
</script>

我们也可以看到这里调用了一个`addToCart`方法，并且在点击“Add to Cart”按钮时触发。这个方法将会调用Vuex的`commit`方法，来更新购物车状态。

接下来，我们需要实现购物车功能。我们在`src`文件夹中创建一个名为`store`的文件夹，并在其中创建一个`index.js`文件。这个文件将会包含我们的Vuex store。我们需要定义一个名为`cart`的state，来存储购物车信息，以及一个名为`addToCart`的mutation，来将商品添加到购物车中。代码如下：

import Vue from 'vue';
import Vuex from 'vuex';

Vue.use(Vuex);

export default new Vuex.Store({
  state: {
    cart: [],
  },
  mutations: {
    addToCart(state, product) {
      state.cart.push(product);
    },
  },
});

现在我们已经有了商品列表和购物车功能，我们需要实现一个订单页面，来展示用户的订单信息。我们在`components`文件夹中创建一个名为`OrderList.vue`的组件。这个组件将会展示用户的订单信息。我们可以使用`v-for`指令来循环渲染每一个订单，代码如下：

<template>
  <div>
    <h1>Order List</h1>
    <ul>
      <li v-for="order in orders" :key="order.id">
        <h2>{{ order.name }}</h2>
        <p>{{ order.description }}</p>
        <p>Price: {{ order.price }}</p>
      </li>
    </ul>
  </div>
</template>

<script>
export default {
  computed: {
    orders() {
      return this.$store.state.cart;
    },
  },
};
</script>

我们可以看到，在这个组件中，我们使用了Vuex的`state`来获取购物车信息，然后将其展示在订单列表中。

最后，我们需要使用Vue Router来实现路由功能。我们在`src`文件夹中创建一个名为`router`的文件夹，并在其中创建一个`index.js`文件。这个文件将会包含我们的路由配置。我们需要定义两个路由：一个用于展示商品列表，一个用于展示订单列表。代码如下：

import Vue from 'vue';
import VueRouter from 'vue-router';
import ProductList from '@/components/ProductList.vue';
import OrderList from '@/components/OrderList.vue';

Vue.use(VueRouter);

const routes = [
  {
    path: '/',
    name: 'ProductList',
    component: ProductList,
  },
  {
    path: '/orders',
    name: 'OrderList',
    component: OrderList,
  },
];

const router = new VueRouter({
  mode: 'history',
  base: process.env.BASE_URL,
  routes,
});

export default router;

我们可以看到，在这个配置中，我们定义了两个路由，并且将其对应到了组件中。

现在我们已经完成了一个简单的Vue项目。我们可以在终端中输入以下命令，来启动这个项目：

npm run serve

在浏览器中打开`http://localhost:8080`，我们可以看到商品列表页面。在这个页面中，我们可以浏览商品信息，并将商品添加到购物车中。我们还可以点击页面上的“Orders”链接，来跳转到订单页面，展示用户的订单信息。