input.vue 850 B

1234567891011121314151617181920212223242526272829303132333435363738394041
  1. <template>
  2. <div class="form-input mb-4 last:mb-0 flex" :style="options.style">
  3. <v-label :options="options" :datas="datas"></v-label>
  4. <div class="form-value flex-1">
  5. <input class="input w-full" :value="options.value" @input="handleChange" />
  6. </div>
  7. </div>
  8. </template>
  9. <script>
  10. import Base from '../base';
  11. import vLabel from './label';
  12. export default {
  13. name: 'v-form-input',
  14. extends: Base,
  15. components: {
  16. vLabel
  17. },
  18. props: {
  19. value: String,
  20. },
  21. methods: {
  22. handleChange(event){
  23. console.log('update:value', event.target.value);
  24. this.$emit('update:value', event.target.value);
  25. }
  26. }
  27. }
  28. </script>
  29. <style lang="less" scoped>
  30. .form-input {
  31. .input {
  32. padding: 0.5rem;
  33. font-size: 1rem;
  34. line-height: 1;
  35. background: rgba(255, 255, 255, 0.5);
  36. border-radius: 0.4rem;
  37. }
  38. }
  39. </style>