Javascript 如何使用指定的键获取值？

有一个使用

$从JSON源代码创建的数组。每个
方法。这是控制台所说的：

$vm0.sailNames;
[Array(24), __ob__: Observer]

（出于某种原因，jQuery创建了一个观察者）

在Vue.js dev视图中，它看起来是这样的：

如何将
displayName
值作为参数传递给
name
？是否有任何Vue.js阵列方法可以做到这一点

--编辑：添加一些标记：

data() {
    return {
      (...)
      sailNames: [],
      (...)
    }
  },
  methods: {
    someMethod(name) {
      console.log("sailNames: ", this.sailNames);
      let item = this.sailNames.find(s => s.name == name);
      console.log("name (someMethod's arg.): ", name);
      console.log("item: ", item);

    },
    showName: function(e) { // this is the function triggered @click
      (...)
      const sourceElement = e.target.id;
      this.someMethod(sourceElement);
      (...)
    },
    (...)

DOM元素上的控制台输出单击：

sailNames:  [Array(24), __ob__: Observer]
name (someMethod's arg.):  grot
item:  undefined`

模板中的DOM元素：

<svg>
(...)
    <g id="sailShapes">
        <path class="rope" d="M 15,589 395,94" />
        <path id="latacz" d="M 160,404 255,391 390,104 z" class="sail" @click="showName" />
        <path class="rope" d="M 30,592 395,179" />
        <path id="grot" d="M 100,519 285,490 330,254 z" class="sail" @click="showName" />
    (...)
    </g>
(...)
</svg>


(...)
(...)
(...)
这将为您提供对象

methods:{
  someMethod(name){
    let item=  this.sailNames.find(s => s.name == name)
    if (!item)
      //error

    // use item.displayName in code
  }
}

但是，通常，如果在模板中渲染
sailNames
，则可以将整个对象传递给方法

<ul>
  <li v-for="item in sailNames" @click="someMethod(item)">{{item.name}}</li>
</ul>

编辑

对于未来的读者，在填充
sailNames
的过程中有一个小错误，导致上述方法无法工作。解决了这个问题，一切都变了。
jQuery没有创建观察者，Vue将数据转换为观察值。只需使用普通javascript即可。你想在哪里使用它？用什么方法？模板“sailNames”在数据中定义，然后由jQuery的$.each方法更新。填充完数组后，我试图在一个方法中使用它的值，这个方法是通过点击DOM元素触发的。someMethod（）的主体中有console.logs以正确的形状显示sailNames数组，而且“name”参数读取正确，但“item”变量最终仍然未定义。我选择了第一个选项，模板中没有v-for。@a如果您共享代码，我可以查看。在问题正文中添加了一些代码，请查看。@a如果您添加了使用
sailNames
的模板，可以吗？触发元素是SVG形状，上面添加的示例。如果足够，请告诉我。
someMethod(item){
  //use item.displayName
}