Javascript 如何在html上声明组件道具<；模板>；在Vue.js上标记

我正在使用Vue。与在javascript上声明模板不同，我更喜欢在sublime上使用html方式实现可读性和代码检测，因此我使用以下方法：

<template id="test-component">
  <h1>Testing</h1>
</template>

Vue.component('test', {
  template: '#test-component'
});

<test></test>

测试
Vue.组件（“测试”{
模板：“#测试组件”
});

很管用。。但我想向模板传递一些数据，如下所示：

<template id="test-component">
  <h1>{{text}}</h1>
</template>

Vue.component('test', {
  template: '#test-component',
  props: ['text']
});

<test text="asd"></test>

{{text}}
Vue.组件（“测试”{
模板：“#测试组件”，
道具：['text']
});

也很有效，但是。。我想在模板标签上声明道具，以便在我的项目上更易于阅读，而不是在javascript组件函数上，有什么方法可以做到这一点吗？类似这样的东西（不起作用）：

{{text}}

您不能像建议的那样在模板标签上声明道具，唯一的方法是根据文档用JavaScript声明道具

我真的不知道你为什么要这样做，或者它将如何提高可读性。道具是组件定义本身的一部分，而不是模板。也不是所有的道具都可以在模板中呈现。您认为计算属性也应该在模板标记上指定吗

<template id="test-component" props="['text]">
  <h1>{{text}}</h1>
</template>