ai-form-item.vue 857 B

1234567891011121314151617181920212223242526272829303132333435
  1. <template>
  2. <uv-form-item ref="formItem" v-bind="$attrs" :id="idPrefix+$attrs.prop">
  3. <template v-for="(_, name) in $slots" #[name]>
  4. <slot :name="name"/>
  5. </template>
  6. </uv-form-item>
  7. </template>
  8. <script>
  9. // NOTE: 如果直接用extends继承,样式无法继承,所以改用这个形式做props穿透和事件穿透
  10. // 这样做的缺陷就是使用时的提示不够明显
  11. export default {
  12. name: "ai-form-item",
  13. inject: ['getIdPrefix'],
  14. provide() {
  15. return {
  16. getFormItem: () => this.$refs.formItem
  17. }
  18. },
  19. computed: {
  20. idPrefix() {
  21. // noinspection JSUnresolvedFunction
  22. return this.getIdPrefix()
  23. }
  24. }
  25. }
  26. </script>
  27. <style scoped>
  28. ::v-deep .uv-form-item__body__right__message {
  29. text-align: right;
  30. margin-right: 10px;
  31. }
  32. </style>