Как я могу получить значение в файле JSON по тегу и городские опции с помощью VUE?

Question

Во-первых, мой английский не очень хорош. Извините за это.

1-) Мой случай таков: когда я записываю необходимую информацию в пробелы, - например, название работы для одного пробела, а для другого пробела - название города (например, Стамбул) - я хочу увидеть работу в этом городе на стр.

2-) Кроме того, когда я использую поле для поиска чего-либо, мне нужно использовать заглавные буквы, чтобы увидеть результат. Я хочу видеть результат независимо от того, как я наберу букву, прописной или нет, как мне этого добиться?

Спасибо за помощь.

это полный код

var app = new Vue({
  el: "#app",
  data: {
    founded: [],
    search: "",
    show: false,
    city: ""
  },
  created() {
    fetch("job.json")
      .then(res => {
        return res.json();
      })
      .then(res => {
        this.founded = res.items;
      });
  },
  computed: {
    filteredFounded: function() {
      return this.founded.filter(items => {
        return (
          items.cityName === this.city && items.positionName.match(this.search)
        );
      });
    }
  }
});

  <div class="header">
        <h4>Get Job</h4>
    </div>



    <div id="app" class="nested">
        <div class="card w-50">
            <div class="search">
                <input type="text" class="job" v-model="search" placeholder="Job..." @keypress.enter="founded">
                <select name="" class="city" id="" v-model="city">
                    <option value="Seçiniz">Seçiniz</option>
                    <option value="İstanbul">İstanbul</option>
                    <option value="Ankara">Ankara</option>
                    <option value="İzmir">İzmir</option>
                    <option value="Çanakkale">Çanakkale</option>
                </select>
            </div>

            <div class="find">
                <button @click="show = true">Find!</button>
            </div>

            <div class="card-body" v-show="show" v-for="items in filteredFounded">
                <h5 class="card-title">{{items.companyName}}</h5>
                <p class="card-text">{{items.positionName}}</p>
                <p class="card-text">{{items.cityName}}</p>
                <p class="card-text">{{items.townName}}</p>
                <p class="card-text">{{items.distance}}</p>
                <a href="#" class="btn btn-primary">Go!</a>
            </div>
        </div>
    </div>

и это файл job.json

Answer 1

Вы можете добиться этого, сначала превратив необходимые данные в строчные или прописные буквы. Вы делаете это, используя функции toLowerCase () или toUpperCase () , а затем сравниваете данные. Например, вы можете сделать что-то вроде этого.

computed: {
            filteredFounded: function () {
                return this.founded.filter(items => {
                    return (
                        items.cityName.toLowerCase() === this.city.toLowerCase() && items.positionName.toLowerCase().match(this.search.toLowerCase())
                    );
                });
            }
        }