Skip to content

selected attribute on select option won't get added when the select is using :value instead of v-model #13528

Open
@n0099

Description

@n0099

Vue version

3.5.17

Link to minimal reproduction

https://play.vuejs.org/#__SSR__eNp9kUFLAzEQhf9KzKUK3V2kFqVuCyo96EFFxVNAlu20bs0mIZmshbL/3Uliaw/SU3bme3l5M7vlN8bknQc+4aWrbWOQOUBvZkI1rdEW2ZZZWLKeLa1u2YCkA6GEqrVyyLpKemDToDgdIDgcnF0LVRbJiTyoQGiNrBBCheVJlrHSgYSabmetXoCcCh59BJ+xLEuyX8UkggNBgIS1wUar9DzR8DLBcLCEyiKdya1IdlSUxUEcPuToaJBls8rXTivawVYoxgSvdWsaCfYpmjjBJyySwCop9fdD7KH1MNz160+ov/7pr90m9AR/tuDAdjTGnmFlV0DRA56/PsKGvveQluMlqY/AF3Ba+pAxyW69WlDsA11Mex//ZKNWb26+QVBuN1QIGpR91NOaPdwdGf0v7ii/iPeE6mmLHx3Y4EkLHOXj/Pwy9NC977vj/Cof8f4H1hvPEA

Steps to reproduce

Switch line 8 and 9 to see the different result in SSR tab.

What is expected?

<select :value="value"> should result in the same under SSR like <select v-model="value">

function ssrRender(_ctx, _push, _parent, _attrs, $props, $setup, $data, $options) {
  _push(`<select${
    _ssrRenderAttrs(_attrs)
  }><!-- <select :value="value"> --><option value="test"${
    (_ssrIncludeBooleanAttr((Array.isArray($setup.value))
      ? _ssrLooseContain($setup.value, "test")
      : _ssrLooseEqual($setup.value, "test"))) ? " selected" : ""
  }>test option</option></select>`)
}

What is actually happening?

function ssrRender(_ctx, _push, _parent, _attrs, $props, $setup, $data, $options) {
  _push(`<!--[--><!-- <select v-model="value"> --><select${_ssrRenderAttrs(_mergeProps({ value: $setup.value }, _attrs))}><option value="test">test option</option></select><!--]-->`)
}

System Info

No response

Any additional comments?

If v-model still remains syntax sugar in vue3 like in vue2 [1][2], there should be no different.

Metadata

Metadata

Assignees

No one assigned

    Labels

    🔨 p3-minor-bugPriority 3: this fixes a bug, but is an edge case that only affects very specific usage.has workaroundA workaround has been found to avoid the problemscope: ssr

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions