格式化代码

src/index.vue

 <template>
-    <section>
-        <button @click="createOrder" >点击创建订单</button>
-        <div class="detailsAndBuy" v-show="orderId">
-            <div>
-                <p>订单详情</p>
-                <p>商品名：{{orderDetails.goodsLabel}}</p>
-                <p>单价：{{orderDetails.price}}</p>
-                <p>数量：{{orderDetails.quantity}}</p>
-                <p>总价：{{orderDetails.totalFee}}</p>
-                <p>付款状态：{{orderDetails.status}}</p>
-            </div>
-            <button class="buy" @click="goPrePay">购买</button>
-        </div>
-    </section>
+  <section>
+    <button @click="createOrder">点击创建订单</button>
+    <div class="detailsAndBuy" v-show="orderId">
+      <div>
+        <p>订单详情</p>
+        <p>商品名：{{orderDetails.goodsLabel}}</p>
+        <p>单价：{{orderDetails.price}}</p>
+        <p>数量：{{orderDetails.quantity}}</p>
+        <p>总价：{{orderDetails.totalFee}}</p>
+        <p>付款状态：{{orderDetails.status}}</p>
+      </div>
+      <button class="buy" @click="goPrePay">购买</button>
+    </div>
+  </section>
 </template>
 
 <script>
-    export default {
-        name: "index.vue",
-        data() {
-            return {
-                token: '08A7A6D8AA224AB7BC2E7BC44D44F34E',
-                orderId: null,
-                prePayId: null,
-                isDisabled: false,
-                orderDetails: {}
-            }
+export default {
+  name: "index.vue",
+  data() {
+    return {
+      token: "08A7A6D8AA224AB7BC2E7BC44D44F34E",
+      orderId: null,
+      prePayId: null,
+      isDisabled: false,
+      orderDetails: {}
+    };
+  },
+  mounted() {},
+  methods: {
+    createOrder() {
+      if (this.isDisabled) {
+        alert("订单已创建");
+        return;
+      }
+      const data = {
+        goodsId: 123,
+        goodsVersion: 1,
+        price: 0.01,
+        quantity: 1
+      };
+      this.axios({
+        method: "POST",
+        headers: {
+          token: this.token
         },
-        mounted() {
-
+        url: `${this.APIDOMAIN}/trade/center/order`,
+        data: data
+      })
+        .then(res => {
+          if (res.data.code == "000000") {
+            this.orderId = res.data.data;
+            this.isDisabled = true;
+            this.getOrderDetails();
+          }
+        })
+        .catch(res => {
+          //do somethings
+        });
+    },
+    getOrderDetails() {
+      this.axios({
+        method: "GET",
+        headers: {
+          token: this.token
         },
-        methods: {
-            createOrder() {
-                if(this.isDisabled) {
-                    alert('订单已创建');
-                    return;
-                }
-                const data = {
-                    goodsId: 123,
-                    goodsVersion: 1,
-                    price: 0.01,
-                    quantity: 1
-                }
-                this.axios(
-                    {
-                        method: 'POST',
-                        headers: {
-                            token: this.token,
-                        },
-                        url: `${this.APIDOMAIN}/trade/center/order`,
-                        data: data
-                    }
-                ).then((res)=>{
-                    if(res.data.code == "000000") {
-                       this.orderId = res.data.data;
-                       this.isDisabled = true;
-                       this.getOrderDetails();
-                    }
-                }).catch((res)=>{
-                    //do somethings
-                })
-            },
-            getOrderDetails() {
-                this.axios(
-                    {
-                        method: 'GET',
-                        headers: {
-                            token: this.token,
-                        },
-                        url: `${this.APIDOMAIN}/trade/center/order/${this.orderId}`,
-                    }
-                ).then((res)=>{
-                    if(res.data.code == "000000") {
-                        this.orderDetails = res.data.data
-                    }
-                }).catch((res)=>{
-                    //do somethings
-                })
-            },
-            goPrePay() {
-                this.axios(
-                    {
-                        method: 'POST',
-                        headers: {
-                            token: this.token,
-                        },
-                        url: `${this.APIDOMAIN}/trade/center/prepay`,
-                        data: {
-                            payChannel: 1,
-                            orderId: this.orderId
-                        }
-                    }
-                ).then((res)=>{
-                    if(res.data.code == "000000") {
-                        this.prePayId = res.data.data;
-                    }
-                }).catch((res)=>{
-                    //do somethings
-                })
-            },
-
+        url: `${this.APIDOMAIN}/trade/center/order/${this.orderId}`
+      })
+        .then(res => {
+          if (res.data.code == "000000") {
+            this.orderDetails = res.data.data;
+          }
+        })
+        .catch(res => {
+          //do somethings
+        });
+    },
+    goPrePay() {
+      this.axios({
+        method: "POST",
+        headers: {
+          token: this.token
         },
+        url: `${this.APIDOMAIN}/trade/center/prepay`,
+        data: {
+          payChannel: 1,
+          orderId: this.orderId
+        }
+      })
+        .then(res => {
+          if (res.data.code == "000000") {
+            this.prePayId = res.data.data;
+          }
+        })
+        .catch(res => {
+          //do somethings
+        });
     }
+  }
+};
 </script>
 
 <style scoped>
-    input {
-        margin: 0 auto;
-        border: 1px solid #000;
-        margin-bottom: 10px;
-    }
-    button {
-        display: block;
-        margin: 0 auto;
-        background: #42b983;
-        color: #fff;
-    }
+input {
+  margin: 0 auto;
+  border: 1px solid #000;
+  margin-bottom: 10px;
+}
+button {
+  display: block;
+  margin: 0 auto;
+  background: #42b983;
+  color: #fff;
+}
 </style>
\ No newline at end of file