New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Move computed+watchers and class+style #31
Conversation
src/guide/computed.md
Outdated
<!-- is able to remain small by not reinventing them. This also --> | ||
<!-- gives you the freedom to use what you're familiar with. --> | ||
<script src="https://cdn.jsdelivr.net/npm/axios@0.12.0/dist/axios.min.js"></script> | ||
<script src="https://cdn.jsdelivr.net/npm/lodash@4.13.1/lodash.min.js"></script> |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Does it complicate things to introduce a third party library like lodash in the example? I've worked on a number of projects where they avoided lodash and it could be seen as another thing that people have to learn to understand the example. But maybe not? Curious what your thought is on it.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
So far I am not changing examples from Vue 2 docs (except moving them to Vue 3 syntax). But I think you're right and I will try to change this one
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
@bencodezen I fixed an example, could you please look at it one more time?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Is the purpose of this PR is only migration or we are considering possible rewrites too?
}; | ||
}, | ||
computed: { | ||
reversedMessage: function() { |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I feel this example is introducing to complex handling of strings which is out of the scope here. We can add a simpler example something like sum of two numbers as computed property.
|
||
[Learn how computed properties work with a free lesson on Vue School](https://vueschool.io/lessons/vuejs-computed-properties?friend=vuejs) | ||
|
||
In-template expressions are very convenient, but they are meant for simple operations. Putting too much logic in your templates can make them bloated and hard to maintain. For example: |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
The above example makes sense, but in my opinion, we introduce computed properties as a mechanism to get derived values. The introduction as a solution to prevent complex expressions in templates does not sound that impressive.
I think our current focus should be migration. Rewrites/improvements can go
next, to not complicate the process.
Rahul Kadyan <notifications@github.com> schrieb am So. 19. Jan. 2020 um
10:24:
… ***@***.**** commented on this pull request.
Is the purpose of this PR is only migration or we are considering possible
rewrites too?
------------------------------
In src/.vuepress/components/computed-1.vue
<#31 (comment)>:
> +<template>
+ <div id="example" class="demo">
+ <p>Original message: "{{ message }}"</p>
+ <p>Computed reversed message: "{{ reversedMessage }}"</p>
+ </div>
+</template>
+
+<script>
+export default {
+ data() {
+ return {
+ message: 'Hello'
+ };
+ },
+ computed: {
+ reversedMessage: function() {
I feel this example is introducing to complex handling of strings which is
out of the scope here. We can add a simpler example something like sum of
two numbers as computed property.
------------------------------
In src/guide/computed.md
<#31 (comment)>:
> @@ -0,0 +1,243 @@
+# Computed Properties and Watchers
+
+## Computed Properties
+
+[Learn how computed properties work with a free lesson on Vue School](https://vueschool.io/lessons/vuejs-computed-properties?friend=vuejs)
+
+In-template expressions are very convenient, but they are meant for simple operations. Putting too much logic in your templates can make them bloated and hard to maintain. For example:
The above example makes sense, but in my opinion, we introduce computed
properties as a mechanism to get derived values. The introduction as a
solution to prevent complex expressions in templates does not sound that
impressive.
—
You are receiving this because your review was requested.
Reply to this email directly, view it on GitHub
<#31>,
or unsubscribe
<https://github.com/notifications/unsubscribe-auth/AB5O3USZ62QETACOXKZNX63Q6QL4TANCNFSM4KELMTUA>
.
|
Sorry for the delay @NataliaTepluhina. Thanks for your work on this! |
Warning: class and style needs a check after https://github.com/vuejs/rfcs/blob/attr-fallthrough/active-rfcs/0000-attr-fallthrough.md is merged as currently classes and styles are NOT merged to the single root node attributes