Collectives™ on Stack Overflow
Find centralized, trusted content and collaborate around the technologies you use most.
Learn more about Collectives
Teams
Q&A for work
Connect and share knowledge within a single location that is structured and easy to search.
Learn more about Teams
template: '<svg xmlns="http://www.w3.org/2000/svg" :viewBox="viewBox" :width="width" :height="height"></svg>',
0 0 + width + height
doesn't work, how to fix it? Im new in Vue.js.
Thanks!
In addition to the fact that you should define
viewBox
as a computed value like @ittus pointed out,
0 0 + width + height
does not evaluate to a string because:
a)
0 0
is not valid javascript (
Uncaught SyntaxError: Unexpected number
)
b)
width
and
height
are both numbers.
0 + width + height
would evaluate to a number, 48 by default.
Use one of the following to create a string:
Concatenation (
Read more here
):
viewBox: {
default: '0 0 ' + this.width + ' ' + this.height
or a template literal (Read more here):
viewBox: {
default: `0 0 ${this.width} ${this.height}`
template: '<svg xmlns="http://www.w3.org/2000/svg" :viewBox="viewBox" :width="width" :height="height"></svg>',
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
