cookie to share//conmon.js //page1.html page2.html .........

//conmon.js

function getCookie(name) {
    const cookieArr = document.cookie.split(';')
    let myArr = null;
    for (let i = 0; i < cookieArr.length; i++) {
      const cookiePair = cookieArr[i].split('=');
      const cookieName = cookiePair[0].trim();
      if (cookieName === name) {
        const cookieValue = decodeURIComponent(cookiePair[1]);
        myArr = JSON.parse(cookieValue);
        console.log(myArr, `${name}`); // ['BBQ', 'DQA', 'DIR']
        break;
      }
    }
    return myArr  
 }
  
  function getCookieStr(name) {
    const cookieArr = document.cookie.split(';')
    let myArr = null;
    for (let i = 0; i < cookieArr.length; i++) {
      const cookiePair = cookieArr[i].split('=');
      const cookieName = cookiePair[0].trim();
      if (cookieName === name) {
        myArr = cookiePair[1]
        console.log(myArr, `${name}`); // ['BBQ', 'DQA', 'DIR']
        break;
      }
    }
    return myArr
 }
  
  function updateCookie(name,value) {
    // console.log('Selected Option:', this.selectedApp);
    document.cookie = `${name}=${value}` + "; path=/";
  }

//page1.html page2.html ....

<!DOCTYPE html>
<html>

<head>
  <meta charset="utf-8">
  <title>Paint</title>
  <style>
    /* 修改select控件的外观 */
    .selectProject {
      appearance: none;
      padding: 8px 16px;
      font-size: 16px;
      border: 2px solid #2196F3;
      border-radius: 10px;
      background-color: transparent;
      color: #2196F3;
      outline: none;
      cursor: pointer;
    }

    /* 修改select控件的选项的外观 */
    .selectOption {
      background-color: #fff;
      color: #000;
    }

    /* 修改选中选项的外观 */
    .selectOption:checked {
      background-color: #2196F3;
      color: #fff;
    }

    /* 修改聚焦状态下的外观 */
    .selectProject:focus .selectOption {
      background-color: #fff;
      color: #2196F3;
    }
  </style>
</head>

<body>
  <div id="app">
    <h1>Paint</h1>
    <label for="select-app">Select app:</label>
    <select id="select-app" class="selectProject" v-model="selectedApp" @change="updateCookie">
      <option :value="item" v-for="item in arr" class="selectOption">{{ item }}</option>
    </select>
  </div>
  <script src="https://cdn.jsdelivr.net/npm/vue@2.6.14/dist/vue.js"></script>
  <script src="/js/common.js"></script>
  <script>
    new Vue({
      el: '#app',
      data: {
        arr: [],
        selectedApp: ''
      },
      created() {
        this.arr=getCookie('myArr');
        this.selectedApp=getCookieStr('curProject')
      },
      methods: {
        updateCookie() {
          console.log('Selected Option:', this.selectedApp);
          updateCookie('curProject',this.selectedApp)
          // document.cookie = "curProject=" + this.selectedApp + "; path=/";
        }
      }
    })
  </script>
</body>

</html>