-编写一个vue程序，实现一辆车，里面包含车的品牌 型号 价格 生产日期 生产厂商 要求价格与生产日期及生产厂商为弹窗式-->

在Vue.js中创建一个车辆信息组件，可以实现弹窗式显示价格、生产日期和生产厂商的功能，我们可以使用自定义事件和条件渲染来实现这个需求。下面是一个简单的示例：

<template>
  <div>
    <h3>车辆信息</h3>
    <div v-if="showPrice">
      <button @click="showPriceModal">查看价格</button>
      <modal :visible.sync="priceVisible" title="价格详情">
        <p>价格: {{ vehicle.price }}</p>
      </modal>
    </div>
    
    <div v-if="showProductionDetails">
      <button @click="showProductionModal">查看生产信息</button>
      <modal :visible.sync="productionVisible" title="生产详情">
        <p>生产日期: {{ vehicle.productionDate }}</p>
        <p>厂商: {{ vehicle.manufacturer }}</p>
      </modal>
    </div>
  </div>
</template>

<script>
export default {
  data() {
    return {
      vehicle: {
        brand: '',
        model: '',
        price: '',
        productionDate: '',
        manufacturer: '',
        showPrice: false,
        showProductionDetails: false,
        priceVisible: false,
        productionVisible: false,
      },
    };
  },
  methods: {
    showPriceModal() {
      this.showPrice = true;
    },
    showProductionModal() {
      this.showProductionDetails = true;
    },
  },
};
</script>

<style scoped>
.modal {
  /* 根据实际需求添加样式 */
}
</style>

在这个例子中，我们定义了一个`VehicleInfo`组件，其中包含了车辆的基本信息以及两个按钮，点击后会通过`showPriceModal`和`showProductionModal`方法开启对应的弹窗模态框（`modal`）。在模板中，我们使用了`v-if`指令来控制模态框的显示状态。

当用户点击价格或生产信息按钮时，对应的状态会被设置为`true`，这会让相应的模态框显示出来。每个模态框的内容都是基于`vehicle`对象的数据绑定的。

注意，这只是一个基础示例，实际应用中可能需要连接到后台API获取车辆详细信息，并使用更复杂的UI库（如Element UI）来构建弹窗组件。同时，对于弹窗的设计和交互细节，可以根据具体需求进行调整。