Skip to content

设置了autosize的input控件,当绑定的字符串修改后,宽度没有自适应改变 #7269

@nanofrog

Description

@nanofrog

Describe the bug

以下测试代码中,如果在 textarea 中修改字符串,input的文本会变化,但宽度没有跟着变。
当在input中修改字符串时,宽度能够正常变化。
好像只能通过模拟input事件的方式来解决这个问题。

<template>
  <n-space vertical>
    <n-input v-model:value="value" type="text" placeholder="Basic Input" autosize/>
    <n-input
      v-model:value="value"
      type="textarea"
      placeholder="Basic Textarea"
    />
  </n-space>
</template>

<script setup lang="ts">
import { ref } from 'vue'

const value = ref(null)
</script>

Steps to reproduce

demo 中的 textarea 中输入字符串,input宽度不会变。在input中输入字符串,宽度能正常变化

Link to minimal reproduction

https://play-naive.pro-components.cn/#eNqdkj1v2zAQhv8KwSUtENtDOxlOgabNkA5t0WbUwlJnhSlFEuRRcWL4v+eOimLBlj1kEnjPfb6vtvJrCPMug1zKFUIbrEL4UjkhVm6mvVubZhai70wNsYQLsF7VxjWzfyoe0sJbSEk1cMwKdR7N2miFxruplL6Fr5WdpoXXRll/tNso5Tu0XiwOCxfnK5mfnMzw/O6lfPp2RidlY3gs9moxMoSeSUcTUCTAHIRVrrmqJKZKEjVt8BFFuXkdfSsu5gt+sLMX3KmvpUx5KQcwZXkKSoPoICIdafeOGxcyio7FAbvslM1A08u3kgKfAj8RNkgvaqjh3lu6goLXKhktbrmemMrok3mGwZih9aDgiQkDHg1SEdQeTM28O8jqZ7LW5cp3KbwVEdZi9ypyr27lyLtE6vCu4oozPrhs7ceR8CQ7pt7i+UPyjrTf8jaV1L4NxkL8FfifomFLUQgzZa1//FFiGDNcDnF9D/r/RPwhbThWyd8REsSOlHtjJEUDZAHjm78/i1VvkETPlrLPwD+QvM28Y592nV1Na4/yyra3RSf6y+/SzQbBpeEoXpQzdyWfnM3w7czp+3U/zT+Xusrt5O4F3LuHXw==

System Info

System:
    OS: Windows 11 10.0.26100
    CPU: (24) x64 AMD Ryzen 9 9900X 12-Core Processor
    Memory: 18.95 GB / 61.61 GB
  Binaries:
    Node: 22.17.1 - D:\bin\node-v22.17.1-win-x64\node.EXE
    npm: 11.4.2 - D:\bin\node-v22.17.1-win-x64\npm.CMD
    pnpm: 10.15.0 - D:\bin\node-v22.17.1-win-x64\pnpm.CMD
  Browsers:
    Chrome: 140.0.7339.187
    Edge: Chromium (140.0.3485.54)

Used Package Manager

npm

Validations

Metadata

Metadata

Assignees

No one assigned

    Labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions