FillItem.vue 800 B

1234567891011121314151617181920212223242526272829303132333435363738394041424344
  1. <template>
  2. <uni-popup background-color="#fff" ref="fillRef">
  3. <view class="popup-content">
  4. <input v-model="result" style="width: 100%" @blur="onBlur" type="text" class="input-box" />
  5. </view>
  6. </uni-popup>
  7. </template>
  8. <script setup>
  9. import {ref, watch} from "vue";
  10. const fillRef = ref(null);
  11. const result = ref('');
  12. const emits = defineEmits(['blur']);
  13. const props = defineProps({
  14. value: {
  15. type: String,
  16. default: ''
  17. },
  18. index: {
  19. type: Number,
  20. }
  21. })
  22. watch(() => props.value, (val) => {
  23. result.value = val;
  24. })
  25. function showPopup() {
  26. fillRef.value.open('top');
  27. }
  28. function onBlur() {
  29. emits("blur", {result: result.value,index: props.index});
  30. }
  31. defineExpose({
  32. showPopup
  33. })
  34. </script>
  35. <style lang="scss" scoped>
  36. .popup-content {
  37. padding: 10px;
  38. }
  39. </style>