I had an interesting idea to create a navigation that for simplicity I’ll call an editable navigation. I wanted this navigation to be easy to use. ...
For further actions, you may consider blocking this person and/or reporting abuse
Good job!
You can also check v-model modifiers: vuejs.org/v2/guide/forms.html#trim
Trim for example can be used like this:
v-model.trim="editLink"
and you dont have to worry about untrimmed data in the editLinks function.
For rearranging the links you can check out:
github.com/SortableJS/Vue.Draggable
I have tried it and it was easy to use.
Nice! I can't wait to try it out and cut down on some of my javascript.
I saw that github and was thinking of giving it a try. Wasn't sure to try and code on my own or use someone's package. Either way I'll look into it.
This is great!
Just one comment about adding links on Enter. I've seen many people forget, especially in JS land, that there is a form element. You can add the function call as the submit handler and you have Enter by default.
codepen.io/maccabee/pen/yvWoLd
Great point! I was working so hard on other examples that I'd seen and forgot I could use a form.
Is my example practical for a form or does it not matter? If this was a live project would I have to worry about sanitation and other things with submitting?
Forms are a logical grouping of inputs. Yours is pretty practical use as it reduces manually event listening. For the modern JS frameworks, creating SPAs, they make less sense as you're mostly making AJAX requests anyway.
For non-SPA Applications, they're very useful as you can add action and method attributes and the default submitting behavior then sends it to the server.
For live projects, HTML5 has native validations for inputs, the-art-of-web.com/html/html5-form..., though I can't recall at the moment if they require the form tag.
Sanitation would need to be done manually though.
I really love Vue. It's ridiculously faster than Angular and quite simpler than React but gosh, Vue —even on its latest version— is so tailored to ES5 that I always end up using React. I wish Evan would release a Vue 3 version based on ES6.
Interesting, I didn't know its more tailored to ES5. I just use it because its what I'm used to so my mind goes to it automatically. I need to work on transitioning into ES6.
Yeah. Due to how it works (writing pure javacript objects), it forces you to write code like the following:
instead of sth like this:
But well. Turns out it's really hard for Vue to fit with ES6 since it uses plain js objects by design, so I understand the Evan's decision and that's why I say that Vue is tailored to ES5.
I guess I just love ES6 because it's closer to other languages and it seems to me that ES6 is kind of cleaner than ES5.
I'd also recommend vuelidate to handle the fields validation.
It's amazing how powerful Vue is! :-)
It really is!