watch a prop typeof array, unexpected execution

This issue has been created since 2022-11-19.

Version

2.7.14

Reproduction link

github.com

Steps to reproduce

  1. clone repo
  2. input something
  3. TheTest component watch will execution

What is expected?

watch will not exec.

What is actually happening?

watch a array prop, pass a static value(not reactive or not in data)

the-test component code
image

app reproduce code
image

i tried change the filters data in setup(or data in Option api) is ok.

i update my repo.just add some comment.and remove one line code unused.

pikaqiu748 wrote this answer on 2022-11-20

It's so weird!!!

kTelyakov wrote this answer on 2022-11-20

@jinan5694 i try to reproduce your issue, but i cant ))
Vue-issue-gif

jinan5694 wrote this answer on 2022-11-20

@jinan5694 i try to reproduce your issue, but i cant )) Vue-issue-gif

sorry for my english first...

i think you has reproduce in gif above.
the input bind value is not relative any other value .

the-test component code
image

app reproduce code
image

i tried change the filters data in setup(or data in Option api) is ok.

i update my repo.just add some comment.and remove one line code unused.

posva wrote this answer on 2022-11-21

This is because of the line

<TheTest :filters="[{ foo: 'bar'}]"></TheTest>

The array being inlined is recreated at each render which happens when you type. Move that array to a const:

<script setup>
const filters = [...]
</script>

<template>
<TheTest :filters="filters"></TheTest>
</template>

Remember to use the forum or the Discord chat to ask questions!

pikaqiu748 wrote this answer on 2022-11-21
pikaqiu748 wrote this answer on 2022-11-21

one more question is why it cause recreate when typing every time.due to diff algorithm,it should update input box only.

jinan5694 wrote this answer on 2022-11-21

This is because of the line

<TheTest :filters="[{ foo: 'bar'}]"></TheTest>

The array being inlined is recreated at each render which happens when you type. Move that array to a const:

<script setup>
const filters = [...]
</script>

<template>
<TheTest :filters="filters"></TheTest>
</template>

Remember to use the forum or the Discord chat to ask questions!

thanks for you response.

i have a question. the same code in vue3 is ok. why has different hehavior?

More Details About Repo
Owner Name vuejs
Repo Name vue
Full Name vuejs/vue
Language TypeScript
Created Date 2013-07-29
Updated Date 2022-12-10
Star Count 201155
Watcher Count 6070
Fork Count 33134
Issue Count 595

YOU MAY BE INTERESTED

Issue Title Created Date Comment Count Updated Date
Issue: Missing space before < in ident string: User Name<username> 9 2021-03-22 2022-09-26
Expand the types of things that can be ids 0 2021-12-03 2022-12-08
Make use of Rust 1.62 features 0 2022-06-30 2022-11-30
Add `size_factor_key` to relevant models 0 2022-01-31 2022-09-17
Hanging comma on `plots` value in defaults.get_default_plots() causes `sim.plot(to_plot='seir')` to fail 0 2022-04-02 2022-10-18
Can't send a command 2 2020-04-07 2022-10-21
Python >= 3.6.0 setup issue with pip requirements (jsonschema needs to be prior to 3.0.0) 7 2019-12-30 2022-10-21
[docs] Typo in landing page 3 2022-10-23 2022-10-31
Is there an option to add auto generated code to populate proto struct from/to go struct ? 2 2021-09-14 2022-10-15
Storing the state object in MultivariateOptimizationResults, or extracting invH by other means 8 2021-08-14 2022-11-11
Healthcheck fails RPC test 10 2020-12-20 2022-11-17
Reproduce paint to image task 1 2021-04-21 2022-11-14
[external completions] Handling completion errors differently while the user types 2 2021-06-17 2022-10-31
EMMC log print 2 2021-09-21 2022-01-07
How to query for frequencies? 2 2021-07-01 2022-09-26
Not working on a real device! 0 2022-02-07 2022-11-27
Text spacing (horizontal) decreases/changes due to pdf2image 5 2021-03-10 2022-12-02
update version string system and build metadata 0 2022-03-15 2022-11-02
Hd Wallet for TNB - Typescript Package - 1 1 2021-06-19 2022-10-24
有一个账号每天凌晨5点多必定导致程序崩溃 2 2022-09-10 2022-12-05
Trying to get in touch regarding a security issue 4 2021-09-14 2022-12-06
Robot Account "403 FORBIDDEN" on "Add" or "Removal" or artifact (image) label 5 2021-10-14 2022-10-10
Need help to understand maximum transfer size this IOCTL supports 3 2021-10-14 2022-10-28
Various errors calling Connect-MicrosoftTeams 2 2022-02-14 2022-11-30
Error on http://www.gamethoitrang.com/game/18470/thoi-trang-nu-kieu-1637.html 1 2022-08-03 2022-07-31
Error on http://www.gamethoitrang.com/game/19248/thoi-trang-nu-kieu-1774.html 1 2022-08-03 2022-09-16
Dropdown menus are on the row before on mobile 0 2022-08-31 2022-09-08
Emails being fired before the "save_post" action 1 2022-08-31 2022-12-01
Document the relationship between JS module blocks and bundling 1 2020-11-19 2022-12-07
Test to ensure that METADATA REQUIRE is equal to the package REQUIRE. 4 2014-06-23 2022-11-25
New Philips HUE White Ambiance 1100 lm LTA009 Not supported 1 2021-12-18 2022-09-01
Intermittent UI test failure - < SettingsAboutTest. verifyAboutFirefoxPreview > 1 2022-03-10 2022-11-20
Are those 'legitimate interest' checkboxes disabled? 0 2021-05-13 2022-12-09
Running 'crictl images' does not return a comprehensive list of images 5 2022-02-09 2022-12-04
Add Überzug image support 15 2019-01-18 2022-12-01
Invalid imports created when generating code for an object using more than one goType 4 2022-06-24 2022-12-01
Make Docker scan works on Linux 1 2020-11-23 2022-12-09
bug: Configuration reload does not affect bucket configuration 3 2022-09-28 2022-12-01
Support serializing JsonWebKey to IETF-standard JWK 1 2021-09-16 2022-12-07
RStudio 1.4.1717 still won't run with R-4.1.0-arm64.pkg 22 2021-06-27 2022-11-12
Compilation performance when grammar is faulty 0 2021-09-17 2022-11-12
Converting Type Constraints 3 2022-01-21 2022-08-17
[Question]: if a page is scrollable,how to get the full height instead of current viewport height 4 2022-05-23 2022-11-20
Add search by tag in frontend 1 2021-08-30 2022-11-28
[venus]docker 中增加对创世文件的支持 1 2022-07-14 2022-09-18
Cloud NAT Dynamic Port Allocation / Endpoint Independent Mapping Failure 2 2022-06-17 2022-09-26
Duplicate key error when 2 record attribute have names ending with 'is' 3 2021-09-16 2022-09-24
run.idp-sql.e2e_test: test_end_to_end failed 1 2022-05-23 2022-10-29
Crash on WebsocketClient.ReceiveAsync with Memory<T> 10 2021-09-16 2022-10-31
Baseline migrations are not considered correctly named by `validateMigrationNaming` option 1 2022-04-12 2022-11-26