技術標籤：小程式

當點選右邊的隨機一個字母 頁面會跳轉到 對應的字母 控制滾動條

<template>
  <div class="city_container">
    <scroll-view class="scroll-view" scroll-y :scroll-into-view="title">// 控制y軸滾動   接收需跳轉到對應的id
      <div v-for="(v,i) in cityData" :key="i" :id=
 
"v.title"> //迴圈出a-z的字母  id固定
          {{v.title}}
      </div>
      <ul>
        <li
          v-for="(v,i) in cityData"
          :key="i"
          :id="v.title"
          @click="scrollIntoView(v.title)" //點選後傳參   需要告訴scroll-into-view跳轉對應的內容id
        >
 
{{v.title}}</li>	// 迴圈出a-字母  id固定
      </ul>
    </scroll-view>
  </div>
</template>


<script>
let cityData = require("../../utils/cityData.js");
console.log(cityData);
export default {
  data() {
    return {
      title: "A",
    };
  },
  methods: {
 

    scrollIntoView(i) {
      console.log(i);
      this.title = i;
    },
};
</script>