如何在不创建二传手和getter的情况下传递道具

Question

在下面的代码中，我将一个对象传递给子组件。Vue 为这个对象中的每个属性创建一对 setter/getter。换句话说，它绑定每个属性以使组件响应。有没有办法传递对象，就像我在这里所做的那样，但没有绑定？在现实生活中的应用程序中，我传递了一个具有十个属性的对象，并且还为每个属性创建了一个 setter/getter 对。这会稍微影响性能。你会推荐什么？

Vue.component('child', {
  template: '<div>Child!</div>',
  props: ['params'],
  created () {
    console.log(this.params)
  }
})
var app = new Vue({
  el: '#app',
  data () {
     return {params: {a: 1, b: 2}}
  } 
})

<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.3.4/vue.js"></script>
<div id="app"><child :params="params"></child></div>

Answer 1

No.

如果将您的属性转换为 getter/setter，这是 Vue 反应性的核心，是性能问题的原因，我会感到非常惊讶。

传递属性的唯一方法是在某个时候将其公开给 Vue，这意味着当你公开它时，它将被转换为 getter/setter。为了在没有它们的情况下传递对象，您需要执行一些操作，例如JSON.stringify对象并将其JSON.parse另一侧。然后，一旦您尝试在子对象中使用 in(例如，通过将其添加为数据属性(，它就会再次转换为响应式对象。