How to destructure props in Vue just like {...props} in React?

Just to add to CMS answer, as this doesn't work (completely) with the given example as 'stroke-width' isn't correctly passed (stroke width needs to be kebab-case). For this to work it needs to be:

<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.js"></script>

<div id="app">
  <my-component></my-component>
</div>

<script>
  Vue.component('my-component', {
    template: `
      <svg>
        <circle v-bind="circle"> </circle>
      </svg>
    `,
    computed: {
      circle() {
        return {
          cx: '50%',
          cy: '50%',
          r: '45%',
          'stroke-width': '10%'
        }
      }
    }
  })

  new Vue({
    el: '#app'
  })
</script>

You can use the v-bind directive to bind all the properties of an object as props:

<svg>
  <circle v-bind="circle"> </circle>
</svg>