Environment: vue 3
1. Error report: ERROR: Invalid assignment target
When inserting slots into the table using element in vue3 and displaying the rate, the optional chain operator is used in v-model.
resulting in an error. ERROR: Invalid assignment target
2. Reasons
First, let’s analyze the RROR: Invalid assignment target situation:
1. Assign values to read-only properties or read-only variables: Some properties or variables in JavaScript are read-only and cannot be reassigned. If you try to assign a value to a read-only property or read-only variable, an "Invalid assignment target" error will occur.
2. Assign expressions that are not allowed to be assigned: Some expressions are not allowed to be assigned, such as function calls, numerical values, Boolean values, etc. If you try to assign an expression that does not allow assignment, an "Invalid assignment target" error will also occur.
3. Wrong assignment to the target in destructuring assignment: Destructuring assignment is a syntax for destructuring the attribute values of an array or object into variables. If you perform an incorrect assignment operation on the target of a destructuring assignment, such as trying to assign a value to a non-variable, an "Invalid assignment target" error will be triggered.
In this error report, it belongs to the second case. The instruction expression of Vue 3 does not support the direct use of the optional chain operator to perform optional chain operations on attributes. The optional chaining operator can only be used to access variables or properties of an object, and cannot be used in assignment operations in expressions.
3. Solve
Just make sure the target is a writable variable, or use a conditional statement to avoid using the optional chaining operator.
normal display:
