3 ms·

I see some worrisome coding patterns here: https://github.com/TahaSh/vue-forum-app/blob/master/src/views/Category.vue https://github.com/TahaSh/vue-forum-app/bl

I see some worrisome coding patterns here: https://github.com/TahaSh/vue-forum-app/blob/master/src/views/Category.vue https://github.com/TahaSh/vue-forum-app/blob/master/src/view... <base-button v-if="isLoggedIn && currentUser.can('own_topics:write')" class="new-topic-button" :to="{ name: 'CreateTopic' }" > There is logic embedded in the view. Does this get compile-time checked (assuming you used a compiler such as TypeScript)? In my opinion this is the weak-point of Vue. It is possible to use JSX in Vue. But it is also possible to use non-compile-time-checked expressions. In React you only have compile-time-checkable syntax. That's better because when a code is written using React (by someone other than you) you immediately have some reassurance that some poor coding patterns are excluded.

crooked-v 7y ago
JSX with Vue doesn't help that much, since you've still got a lot of this.whatever variables that can't be programatically verified at compile time (AFAIK), unlike Typescript verification of prop usage.
ratww 7y ago
There are tools that perform type checking in templates: https://github.com/vuejs/vetur/pull/681#issuecomment-363112704 https://github.com/vuejs/vetur/pull/681#issuecomment-3631127... https://github.com/Yuyz0112/vue-type-check https://github.com/Yuyz0112/vue-type-check
e12e 7y ago
I'm hoping "isLoggedIn" / "currentUser.can" is just a convenient shortcut for conditional rendering, and the authorization is handled by the back-end? I'm assuming that is so... Only I've seen some crazy stuff in front-end centric tutorials that seem to assume code injection isn't possible (if by malware or the js console..).
- SheepSlapper 7y ago
  You're correct, v-if in Vue is for conditional rendering. If the statement evaluates to false then the button isn't added to the DOM. And you're doubly correct, the back-end better verify those requests as well. Can't trust user input, which includes HTTP requests from client apps...
esaym 7y ago
>There is logic embedded in the view. What logic is that? The v-if part? I've done a few larger vue apps where users have many different permissions. I don't see anything wrong with hiding something on the front end if a user doesn't have the permission. What would the alternative be? I remember the days of handling permissions via HTML templating engines... certainly a simple v-if statement in vue is better than that.
- leppr 7y ago
  You have to read at least up to the third sentence to understand the comment.
  - esaym 7y ago
    If the concern is "compile-time checking", then that would be valid as a string template would not be checked I assume.

crooked-v 7y ago

JSX with Vue doesn't help that much, since you've still got a lot of this.whatever variables that can't be programatically verified at compile time (AFAIK), unlike Typescript verification of prop usage.

ratww 7y ago

There are tools that perform type checking in templates: https://github.com/vuejs/vetur/pull/681#issuecomment-363112704 https://github.com/vuejs/vetur/pull/681#issuecomment-3631127... https://github.com/Yuyz0112/vue-type-check https://github.com/Yuyz0112/vue-type-check

e12e 7y ago

I'm hoping "isLoggedIn" / "currentUser.can" is just a convenient shortcut for conditional rendering, and the authorization is handled by the back-end? I'm assuming that is so... Only I've seen some crazy stuff in front-end centric tutorials that seem to assume code injection isn't possible (if by malware or the js console..).

SheepSlapper 7y ago
You're correct, v-if in Vue is for conditional rendering. If the statement evaluates to false then the button isn't added to the DOM. And you're doubly correct, the back-end better verify those requests as well. Can't trust user input, which includes HTTP requests from client apps...

esaym 7y ago

>There is logic embedded in the view. What logic is that? The v-if part? I've done a few larger vue apps where users have many different permissions. I don't see anything wrong with hiding something on the front end if a user doesn't have the permission. What would the alternative be? I remember the days of handling permissions via HTML templating engines... certainly a simple v-if statement in vue is better than that.

leppr 7y ago
You have to read at least up to the third sentence to understand the comment.
- esaym 7y ago
  If the concern is "compile-time checking", then that would be valid as a string template would not be checked I assume.