{"id":183,"date":"2024-05-02T19:56:33","date_gmt":"2024-05-02T11:56:33","guid":{"rendered":"http:\/\/www.shifengzhi.asia\/?p=183"},"modified":"2024-05-03T13:57:06","modified_gmt":"2024-05-03T05:57:06","slug":"%e5%ae%9e%e6%88%98%e8%b4%ad%e7%89%a9%e8%bd%a6%e5%8a%9f%e8%83%bd%e6%a8%a1%e5%9d%97%e5%ae%9e%e7%8e%b0%e7%a7%bb%e5%8a%a8%e7%ab%af","status":"publish","type":"post","link":"https:\/\/boki.shifengzhi.top\/?p=183","title":{"rendered":"[\u5b9e\u6218]\u8d2d\u7269\u8f66\u529f\u80fd\u6a21\u5757\u5b9e\u73b0[\u79fb\u52a8\u7aef]"},"content":{"rendered":"

\u8fd9\u6b21\u662f\u7740\u91cd\u5b9e\u73b0JS\u529f\u80fd\u90e8\u5206\uff0c\u800c\u4e14\u4ee3\u7801\u91cf\u8f83\u5927\uff0c\u5c31\u4e0d\u628a\u5176\u4ed6\u5185\u5bb9\u5c55\u793a\u51fa\u6765\u4e86\uff0c\u770b\u4e00\u4e0b\u5927\u81f4\u7684\u754c\u9762\uff0c\u5982\u4e0b\uff1a
\n

\"\"<\/div><\/p>\n

HTML<\/h3>\n

HTML\u90e8\u5206\u5982\u4e0b\uff1a<\/p>\n

\/\/ index.html\n\n<!DOCTYPE html>\n<html lang="en">\n  <head>\n    <meta charset="UTF-8" \/>\n    <meta http-equiv="X-UA-Compatible" content="IE=edge" \/>\n    <meta name="viewport" content="width=device-width, initial-scale=1.0" \/>\n    <title>\u4e11\u56e2\u5916\u5356<\/title>\n    <link rel="shortcut icon" href=".\/assets\/favicon.ico" type="image\/x-icon" \/>\n    <link rel="stylesheet" href=".\/css\/common.css" \/>\n    <link rel="stylesheet" href=".\/css\/container.css" \/>\n    <link rel="stylesheet" href=".\/css\/footer.css" \/>\n    <link rel="stylesheet" href=".\/css\/add-to-car.css" \/>\n  <\/head>\n  <body>\n    <div class="container">\n      <div class="menu">\n        <div class="menu-item active"><span>\u63a8\u8350<\/span><\/div>\n        <div class="menu-item"><span>\u70ed\u9500<\/span><\/div>\n        <div class="menu-item"><span>\u6298\u6263<\/span><\/div>\n        <div class="menu-item"><span>\u590f\u65e5\u51b0\u5496\u5fc5\u559d\u699c<\/span><\/div>\n        <div class="menu-item"><span>\u8fdb\u5e97\u5fc5\u559d<\/span><\/div>\n        <div class="menu-item"><span>\u53ea\u559d\u7f8e\u5f0f<\/span><\/div>\n        <div class="menu-item"><span>\u9177\u723d\u7279\u8c03\u6c34\u679c\u51b0\u8403<\/span><\/div>\n        <div class="menu-item"><span>\u7ecf\u5178\u5976\u5496<\/span><\/div>\n        <div class="menu-item"><span>\u521b\u610f\u5976\u5496<\/span><\/div>\n        <div class="menu-item"><span>\u745e\u7eb3\u51b0\u5b63<\/span><\/div>\n        <div class="menu-item"><span>\u4e0d\u559d\u5496\u5561<\/span><\/div>\n        <div class="menu-item"><span>\u8f7b\u98df\u751c\u54c1<\/span><\/div>\n        <div class="menu-item"><span>\u70ed\u5356\u5957\u9910<\/span><\/div>\n      <\/div>\n      <div class="goods-list">\n      <\/div>\n    <\/div>\n    <div class="footer">\n      <div class="footer-car-container">\n        <div class="footer-car">\n          <i class="iconfont i-gouwuchefill"><\/i>\n          <span class="footer-car-badge">0<\/span>\n        <\/div>\n        <div class="footer-car-price">\n          <span class="footer-car-unit">\uffe5<\/span>\n          <span class="footer-car-total">0.00<\/span>\n        <\/div>\n        <div class="footer-car-tip">\u914d\u9001\u8d39\uffe50<\/div>\n      <\/div>\n      <div class="footer-pay">\n        <a href="">\u53bb\u7ed3\u7b97<\/a>\n        <span>\u8fd8\u5dee\uffe50\u5143\u8d77\u9001<\/span>\n      <\/div>\n    <\/div>\n\n    <!-- <div class="add-to-car">\n      <i class="iconfont i-jiajianzujianjiahao"><\/i>\n    <\/div> -->\n\n    <script src=".\/js\/data.js"><\/script>\n    <script src=".\/js\/index.js"><\/script>\n  <\/body>\n<\/html><\/code><\/pre>\n
JS<\/h3>\n
js\u529f\u80fd\u90e8\u5206\u5982\u4e0b\uff0c\u5176\u4e2d\u8d2d\u7269\u8f66\u52a8\u753b\u7684CSS\u4f1a\u5728\u540e\u9762\u7ed9\u51fa\u6765<\/p>\n
\/\/ index.js\n\n\/* ES6\u65b0\u8bed\u6cd5\uff0c\u770b\u4e0d\u61c2\u7684\u7528\u540e\u9762\u6ce8\u91ca\u91cc\u7684\u5199\u6cd5 *\/\n\/* \u5355\u4ef6\u5546\u54c1\u7684\u6570\u636e *\/\nclass UIGoods {\n  \/\/ \u6784\u9020\u51fd\u6570\n  constructor(g) {\n    this.data = g\n    this.choose = 0\n  }\n  \/\/ \u83b7\u53d6\u5546\u54c1\u603b\u4ef7\n  getTotalPrice() {\n    return this.data.price * this.choose\n  }\n  \/\/ \u662f\u5426\u9009\u4e2d\u4e86\u6b64\u4ef6\u5546\u54c1\n  isChoose() {\n    return this.choose > 0\n  }\n  \/\/ \u9009\u62e9\u7684\u5546\u54c1\u6570\u91cf\u52a0 1\n  increase() {\n    this.choose++\n  }\n  \/\/ \u9009\u62e9\u7684\u5546\u54c1\u6570\u91cf\u51cf 1\n  decrease() {\n    if(this.choose === 0) return\n    this.choose--\n  }\n}\n\/* \u4e0e\u4e0a\u9762\u5199\u6cd5\u6548\u679c\u4e00\u6837\uff0c\u4e0a\u9762\u7684\u662fES6\u7684\u65b0\u8bed\u6cd5\n\u6784\u9020\u51fd\u6570\uff0c\u4f7f\u7528\u5bf9\u8c61\u6765\u8c03\u7528\u65b9\u6cd5\nfunction UIGoods(g) {\n  this.data = g\n  this.choose = 0\n}\n\u83b7\u53d6\u5546\u54c1\u603b\u4ef7\nUIGoods.prototype.getTotalPrice = function () {\n  return this.data.price * this.choose\n}\n\u662f\u5426\u9009\u4e2d\u4e86\u6b64\u4ef6\u5546\u54c1\nUIGoods.prototype.isChoose = function () {\n  return this.choose > 0\n}\n\u9009\u62e9\u7684\u5546\u54c1\u6570\u91cf\u52a0 1\nUIGoods.prototype.increase = function () {\n  return this.choose++\n}\n\u9009\u62e9\u7684\u5546\u54c1\u6570\u91cf\u51cf 1\nUIGoods.prototype.decrease = function () {\n  if(this.choose === 0) return\n  return this.choose--\n}\n*\/\n\/* \u6574\u4e2a\u754c\u9762\u7684\u6570\u636e *\/\nclass UIData {\n  constructor() {\n    let UiGoods = []\n    goods.map(g => {\n      UiGoods.push(new UIGoods(g))\n    })\n    this.UiGoods = UiGoods\n    \/\/ \u8d77\u9001\u95e8\u69db\n    this.deliveryThreshold = 30\n    \/\/ \u914d\u9001\u8d39\n    this.deliveryPrice = 5\n  }\n  \/\/ \u83b7\u53d6\u603b\u4ef7\n  getTotalPrice() {\n    let sum = 0\n    this.UiGoods.map(g => {\n      sum += g.getTotalPrice()\n    })\n    return sum\n  }\n  \/\/ \u662f\u5426\u9009\u4e2d\u4e86\u67d0\u4ef6\u5546\u54c1\n  isChoose(index) {\n    return this.UiGoods[index].isChoose()\n  }\n  \/\/ \u589e\u52a0\u67d0\u4ef6\u5546\u54c1\u7684\u9009\u4e2d\u6570\u91cf\n  increase(index) {\n    this.UiGoods[index].increase()\n  }\n  \/\/ \u51cf\u5c11\u67d0\u4ef6\u5546\u54c1\u7684\u9009\u4e2d\u6570\u91cf\n  decrease(index) {\n    this.UiGoods[index].decrease()\n  }\n  \/\/ \u5f97\u5230\u603b\u5171\u7684\u9009\u62e9\u6570\u91cf\n  getTotalChooseNumber() {\n    let sum = 0\n    this.UiGoods.map(g => {\n      sum += g.choose\n    })\n    return sum\n  }\n  \/\/ \u8d2d\u7269\u8f66\u4e2d\u662f\u5426\u6709\u5546\u54c1\n  hasGoodsInCar() {\n    return this.getTotalChooseNumber() > 0\n  }\n  \/\/ \u4ef7\u683c\u662f\u5426\u8de8\u8fc7\u4e86\u914d\u9001\u95e8\u69db\n  isCrossDeliveryThreshold() {\n    return this.getTotalPrice() >= this.deliveryThreshold\n  }\n}\n\/* \u6574\u4e2a\u754c\u9762 *\/\nclass UI{\n  constructor() {\n    this.uiData = new UIData()\n    this.doms = {\n      goodsContainer: document.querySelector('.goods-list'),\n      deliveryPrice: document.querySelector('.footer-car-tip'),\n      footerPay: document.querySelector('.footer-pay'),\n      footerPayInnerSpan: document.querySelector('.footer-pay span'),\n      totalPrice: document.querySelector('.footer-car-total'),\n      car: document.querySelector('.footer-car'),\n      badge: document.querySelector('.footer-car-badge'),\n    }\n    \/\/ \u8d2d\u7269\u8f66\u56fe\u6807\u4f4d\u7f6e  \u4e5f\u662f\u540e\u9762\u6dfb\u52a0\u56fe\u6807\u8df3\u8dc3\u52a8\u753b\u7684\u76ee\u6807\u70b9\n    let carRect = this.doms.car.getBoundingClientRect()\n    let jumpTarget = {\n      x: carRect.left + carRect.width \/ 2, \/\/ \u8ddd\u5de6\u8fb9\u7684\u8ddd\u79bb\u52a0\u4e0a\u5bbd\u5ea6\u7684\u4e00\u534a\n      y: carRect.top + carRect.height \/ 5  \/\/ \u8ddd\u9876\u90e8\u7684\u8ddd\u79bb\u52a0\u4e0a\u4e00\u5c0f\u6bb5\u8ddd\u79bb\uff0c\u968f\u610f\u5199\uff0c\u8fd9\u91cc\u7528\u4e86\u9ad8\u5ea6\u7684 1 \/ 5\n    }\n    this.jumpTarget = jumpTarget\n    this.createHTML()\n    this.updateFooter()\n    this.listenEvent()\n  }\n  \/\/ \u76d1\u542c\u5404\u79cd\u4e8b\u4ef6\n  listenEvent() {\n    this.doms.car.addEventListener('animationend', function () {\n      this.classList.remove('animate')\n      \/\/ this.doms.car.classList.remove('animate') \u8fd9\u8981\u7528\u7bad\u5934\u51fd\u6570\u5c31\u8fd9\u4e48\u5199\n    })\n  }\n  \/\/ \u521b\u5efa\u5546\u54c1\u5217\u8868\u7684HTML\n  createHTML() {\n    let HTML = ''\n    this.uiData.UiGoods.map((g, i) => {\n      HTML += `<div class="goods-item">\n          <img src="${g.data.pic}" alt="" class="goods-pic" \/>\n          <div class="goods-info">\n            <h2 class="goods-title">${g.data.title}<\/h2>\n            <p class="goods-desc">${g.data.desc}<\/p>\n            <p class="goods-sell">\n              <span>\u6708\u552e ${g.data.sellNumber}<\/span>\n              <span>\u597d\u8bc4\u7387${g.data.favorRate}%<\/span>\n            <\/p>\n            <div class="goods-confirm">\n              <p class="goods-price">\n                <span class="goods-price-unit">\uffe5<\/span>\n                <span>${g.data.price}<\/span>\n              <\/p>\n              <div class="goods-btns">\n                <i data-index="${i}" class="iconfont i-jianhao"><\/i>\n                <span>${g.choose}<\/span>\n                <i data-index="${i}" class="iconfont i-jiajianzujianjiahao"><\/i>\n              <\/div>\n            <\/div>\n          <\/div>\n        <\/div>`\n    })\n    this.doms.goodsContainer.innerHTML = HTML\n  }\n  \/\/ \u589e\u52a0\u67d0\u4ef6\u5546\u54c1\u7684\u9009\u4e2d\u6570\u91cf\n  increase(index) {\n    this.uiData.increase(index)\n    this.updateGoodsItem(index)\n    this.updateFooter()\n    this.jump(index)\n  }\n  \/\/ \u51cf\u5c11\u67d0\u4ef6\u5546\u54c1\u7684\u9009\u4e2d\u6570\u91cf\n  decrease(index) {\n    this.uiData.decrease(index)\n    this.updateGoodsItem(index)\n    this.updateFooter()\n  }\n  \/\/ \u66f4\u65b0\u67d0\u4ef6\u5546\u54c1\u7684\u663e\u793a\u72b6\u6001\n  updateGoodsItem(index) {\n    let goodsDom = this.doms.goodsContainer.children[index]\n    if (this.uiData.isChoose(index)) {\n      goodsDom.classList.add('active')\n    } else {\n      goodsDom.classList.remove('active')\n    }\n    let span = goodsDom.querySelector('.goods-btns span')\n    span.textContent = this.uiData.UiGoods[index].choose\n  }\n  \/\/ \u66f4\u65b0\u9875\u811a\n  updateFooter() {\n    \/\/ \u5f97\u5230\u603b\u4ef7\u6570\u636e\n    let total = this.uiData.getTotalPrice()\n    \/\/ \u663e\u793a\u914d\u9001\u8d39\n    this.doms.deliveryPrice.textContent = `\u914d\u9001\u8d39\uffe5${this.uiData.deliveryPrice}`\n    \/\/ \u663e\u793a\u662f\u5426\u591f\u8d77\u9001\u4ee5\u53ca\u8fd8\u5dee\u591a\u5c11\u5143\u8d77\u9001\n    if (this.uiData.isCrossDeliveryThreshold()) {\n      \/\/ \u5230\u8fbe\u8d77\u9001\u95e8\u69db\n      this.doms.footerPay.classList.add('active')\n    } else {\n      this.doms.footerPay.classList.remove('active')\n      \/\/ \u66f4\u65b0\u8fd8\u5dee\u591a\u5c11\u5143\u8d77\u9001\n      let dis = this.uiData.deliveryThreshold - total\n      dis = Math.round(dis) \/\/ \u56db\u820d\u4e94\u5165\n      this.doms.footerPayInnerSpan.textContent = `\u8fd8\u5dee\uffe5${dis}\u5143\u8d77\u9001`\n    }\n    \/\/ \u663e\u793a\u603b\u4ef7\n    this.doms.totalPrice.textContent = total.toFixed(2) \/\/ \u4fdd\u7559\u4e24\u4f4d\u5c0f\u6570\n    \/\/ \u8bbe\u7f6e\u8d2d\u7269\u8f66\u56fe\u6807\u7684\u6837\u5f0f\u72b6\u6001\n    if (this.uiData.hasGoodsInCar()) {\n      this.doms.car.classList.add('active')\n    } else {\n      this.doms.car.classList.remove('active')\n    }\n    \/\/ \u8bbe\u7f6e\u8d2d\u7269\u8f66\u56fe\u6807\u4e0a\u7684\u6570\u5b57\n    this.doms.badge.textContent = this.uiData.getTotalChooseNumber()\n  }\n  \/\/ \u8d2d\u7269\u8f66\u52a8\u753b\n  carAnimate() {\n    this.doms.car.classList.add('animate')\n  }\n  \/\/ \u6dfb\u52a0\u5546\u54c1\u6309\u94ae\u5b9e\u73b0\u629b\u7269\u7ebf\u8df3\u8dc3\u52a8\u753b\n  jump(index) {\n    \/\/ \u627e\u5230\u5bf9\u5e94\u5546\u54c1\u7684\u52a0\u53f7\u56fe\u6807\n    let btnAdd = this.doms.goodsContainer.children[index].querySelector('.i-jiajianzujianjiahao')\n    \/\/ \u5f97\u5230\u6309\u94ae\u7684\u4f4d\u7f6e\u4fe1\u606f\n    let rect = btnAdd.getBoundingClientRect()\n    \/\/ \u8df3\u8dc3\u52a8\u753b\u7684\u8d77\u59cb\u5750\u6807\n    let start = {\n      x: rect.left,\n      y: rect.top\n    }\n    \/\/ \u5b9e\u73b0\u8df3\u8dc3\u52a8\u753b\n    let div = document.createElement('div')\n    div.className = 'add-to-car'\n    let i = document.createElement('i')\n    i.className = 'iconfont i-jiajianzujianjiahao'\n    \/\/ \u8bbe\u7f6e\u521d\u59cb\u4f4d\u7f6e\n    div.style.transform = `translateX(${start.x}px)`\n    \/\/ \u5b9e\u73b0\u629b\u7269\u7ebf\uff0c\u5916\u9762\u7684div\u6a2a\u5411\u5300\u901f\u8fd0\u52a8\uff0c\u91cc\u9762\u7684 i \u6570\u503c\u52a0\u901f\u8fd0\u52a8\n    i.style.transform = `translateY(${start.y}px)`\n    div.appendChild(i)\n    document.body.appendChild(div)\n    \/\/ \u5f3a\u5236\u6e32\u67d3  \u8bfb\u53d6\u4f4d\u7f6e\u4f7f\u6d4f\u89c8\u5668\u5f3a\u5236 reflow \uff0c\u4e0d\u7136\u4e0d\u4f1a\u6709\u8fc7\u6e21\uff0c\u53ea\u4f1a\u76f4\u63a5\u6e32\u67d3\u5230\u76ee\u6807\u4f4d\u7f6e\n    div.clientWidth\n    \/\/ \u8bbe\u7f6e\u7ed3\u675f\u4f4d\u7f6e\n    div.style.transform = `translateX(${this.jumpTarget.x}px)`\n    \/\/ \u5b9e\u73b0\u629b\u7269\u7ebf\uff0c\u5916\u9762\u7684div\u6a2a\u5411\u5300\u901f\u8fd0\u52a8\uff0c\u91cc\u9762\u7684 i \u6570\u503c\u52a0\u901f\u8fd0\u52a8\n    i.style.transform = `translateY(${this.jumpTarget.y}px)`\n    \/\/ transition \u7ed3\u675f\u7684\u4e8b\u4ef6\u76d1\u542c\n    div.addEventListener('transitionend', () => {\n      div.remove()\n      this.carAnimate()\n    }, {\n      once: true \/\/ \u4e8b\u4ef6\u4ec5\u89e6\u53d1\u4e00\u6b21\uff0c\u4e0d\u7136 i \u8fd8\u4f1a\u5192\u6ce1\u5230 div \u518d\u89e6\u53d1\u4e00\u6b21\u4e8b\u4ef6\n    })\n  }\n}\n\nlet ui = new UI()\n\n\/* \u4e8b\u4ef6\u7ed1\u5b9a *\/\nui.doms.goodsContainer.addEventListener('click', function (e) {\n  if (e.target.classList.contains('i-jiajianzujianjiahao')) {\n    let index = e.target.dataset.index \/\/ H5\u7684 data-index \u5c5e\u6027\n    ui.increase(index)\n  } else if (e.target.classList.contains('i-jianhao')){\n    let index = e.target.dataset.index \/\/ H5\u7684 data-index \u5c5e\u6027\n    ui.decrease(index)\n  }\n})<\/code><\/pre>\n
add-to-car.css<\/h3>\n
\/\/ add-to-car.css\n\n.add-to-car {\n  position: fixed;\n  color: #fff;\n  font-size: 23rem;\n  line-height: 40rem;\n  text-align: center;\n  z-index: 9;\n  margin-left: -20rem;\n  margin-top: -20rem;\n  left: 0;\n  top: 0;\n  \/* \u5e73\u629b\u8fd0\u52a8\u7684\u6c34\u5e73\u65b9\u5411\uff0c\u6c34\u5e73\u5300\u901f *\/\n  transition: 0.5s linear;\n}\n\n.add-to-car .iconfont {\n  width: 40rem;\n  height: 40rem;\n  background: #4a90e1;\n  border-radius: 50%;\n  display: block;\n  \/* \u5e73\u629b\u8fd0\u52a8\u7684\u7ad6\u76f4\u65b9\u5411\uff0c\u4f7f\u7528\u8d1d\u585e\u5c14\u66f2\u7ebf *\/\n  transition: 0.5s cubic-bezier(0.5, -0.5, 1, 1)\n}<\/code><\/pre>\n
\u62d3\u5c55<\/h3>\n
UIGoods \u90e8\u5206\u4f7f\u7528\u5c5e\u6027\u4fee\u9970\u7b26\u6765\u5199\uff0c\u66f4\u5927\u7a0b\u5ea6\u4fdd\u969c\u5b89\u5168\u6027<\/p>\n
\/\/ index.js\n\/* \u5355\u4ef6\u5546\u54c1\u7684\u6570\u636e *\/\nclass UIGoods {\n  constructor(g) {\n    Object.defineProperty(this, 'data', {\n      get: function () {\n        return g\n      },\n      set: function (value) {\n        throw new Error('data \u662f\u53ea\u8bfb\u5c5e\u6027\uff0c\u4e0d\u80fd\u4fee\u6539')\n      },\n      configurable: false, \/\/ \u4e0d\u80fd\u91cd\u65b0\u66f4\u6539\u914d\u7f6e\n    })\n    let internalChooseValue = 0\n    Object.defineProperty(this, 'choose', {\n      get: function () {\n        return internalChooseValue\n      },\n      set: function (value) {\n        if (typeof value !== 'number') {\n          throw new Error('choose\u5c5e\u6027\u5fc5\u987b\u662f\u6570\u5b57')\n        }\n        var temp = parseInt(value)\n        if (temp !== value) {\n          throw new Error('choose\u5c5e\u6027\u5fc5\u987b\u662f\u6574\u6570')\n        }\n        if (value < 0) {\n          throw new Error('choose\u5c5e\u6027\u5fc5\u987b\u5927\u4e8e\u7b49\u4e8e 0')\n        }\n        internalChooseValue = value\n      },\n      configurable: false, \/\/ \u4e0d\u53ef\u4ee5\u91cd\u65b0\u66f4\u6539\u914d\u7f6e\n    })\n  }<\/code><\/pre>\n
\u4ee3\u7801\u91cf\u8f83\u5927\uff0c\u7ec6\u7ec6\u659f\u914c\uff0c\u7814\u7a76\u7814\u7a76\uff0c\u4e09\u56db\u5929\u901a\u900f\u4e4b\u540e\u53ef\u4ee5\u5c1d\u8bd5\u81ea\u5df1\u5199\u4e00\u4e2a\u590d\u73b0\u4e00\u4e0b<\/p>\n","protected":false},"excerpt":{"rendered":"
\u8fd9\u6b21\u662f\u7740\u91cd\u5b9e\u73b0JS\u529f\u80fd\u90e8\u5206\uff0c\u800c\u4e14\u4ee3\u7801\u91cf\u8f83\u5927\uff0c\u5c31\u4e0d\u628a\u5176\u4ed6\u5185\u5bb9\u5c55\u793a\u51fa\u6765\u4e86\uff0c\u770b\u4e00\u4e0b\u5927\u81f4\u7684\u754c\u9762\uff0c\u5982\u4e0b\uff1a HTML HT […]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[5],"tags":[21],"class_list":["post-183","post","type-post","status-publish","format-standard","hentry","category-5","tag-21"],"_links":{"self":[{"href":"https:\/\/boki.shifengzhi.top\/index.php?rest_route=\/wp\/v2\/posts\/183","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/boki.shifengzhi.top\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/boki.shifengzhi.top\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/boki.shifengzhi.top\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/boki.shifengzhi.top\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=183"}],"version-history":[{"count":4,"href":"https:\/\/boki.shifengzhi.top\/index.php?rest_route=\/wp\/v2\/posts\/183\/revisions"}],"predecessor-version":[{"id":189,"href":"https:\/\/boki.shifengzhi.top\/index.php?rest_route=\/wp\/v2\/posts\/183\/revisions\/189"}],"wp:attachment":[{"href":"https:\/\/boki.shifengzhi.top\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=183"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/boki.shifengzhi.top\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=183"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/boki.shifengzhi.top\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=183"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}