I want to implement a listener/observer for my XPCOM component, so my javascript code can register to be notified of some events. Is it possible?
If I understand you correctly https://developer.mozilla.org/en/Creating_JavaScript_callbacks_in_components might be just the thing you are looking for.
Related
Is it possible to handle touchEvents with Vue3 without external library?
My need is that the element can be moved (drag and drop in another place) by touch. The elements themselves are rendered using v-for. I implemented mouse control without problems, but with touch I got stuck for a day!
I've found only one library for that: https://github.com/robinrodricks/vue3-touch-events
But I really can't understand where I have to put UDM module and how to execute installation steps like that: "You need to include the UMD script of this plugin and you do not need to register this plugin with vue.js."
I can't believe that such popular framework as Vue3 haven't native touch handlers, so I want to ask an advice.
Touch events are supported natively in Vue, in the same way that they are in JavaScript. But the dragging or swiping functionality, you will need to either build yourself, or use a third-party plugin (like hammer.js).
You can use touch events in a similar way to mouse up/ down. For example:
<MyComponent
#mousedown="startDrag(item)"
#mouseup="endDrag(item)"
#mousemove="startDrag(item)"
#touchstart="startDrag(item)"
#touchend="endDrag(item)"
#touchmove="endDrag(item)"
/>
is it possible to re-render all my vue components on a click function
i have read aboutvm.$forceUpdate() but it dose not effect all child components.
is there any other way?
thank you all
You probably not doing things in vue way if you need that kind of functionality, but quick hack which might help you to achieve what you want is to refresh whole page via javascript. So inside click function insert this:
location.reload()
the problem was my function was not working because i wrote it in mounted, and i had to reload or re-render my page to make that function work
after i change my function to updated the problem was solved
vue.js Lifecycle Hooks
Im new to VueJS.
I'm trying to understand the syntax behind emitting events.
There is the following video tutorial where I'm having problems understanding what happens:
https://www.youtube.com/watch?v=5pvG6fzkdFM
Here is the code:
Inside parent:
https://imgur.com/bxcyjZq
https://imgur.com/Rynifqq
And Child (emitting component):
https://imgur.com/iHh3zc3
Now, the first thing I very much DONT understand is how the "v-on:CustomEvent" actually works.
v-on, as I understand it, attaches an event handler. But it doesnt specify it, does it? I usually have to type "v-on:click". So why does anything happen at all in this tutorial when this code is executed? Nowhere is there a definition what kind of event shall trigger the function.
And the second thing is how the data is handled.
In the header, inside the parameter of the function, $event is handed over.
But how is this supposed to give any useful data? The event usually is an object where I have to get the payload extracted manually, like event.target.value?
So why does this work?
You code looks fine, there is no fix needed
Alternate way is, no need to mention $event, it automatically pass with the arguments by just mentioning the method name
<app-header v-bind:title="title" v-on:changeTitle="updateTitle"></app-header>
I'm a little new in VueJS and communicate between components is heavy to understand without a Bus or Vuex.
I have 3 components: CompForm, CompField and CompText.
CompForm is a wrapper with that cointain a lot of CompField. Here I have a data "form: {}".
CompField have a <component :is...> that call a component by a prop.
CompText is a component that is called by CompField
How I can pass the data of CompText to CompForm? I try with :value, #input, slot-scoped, emit and nothing works (Or I'm using it wrong). At this moment I can comunicate CompText to CompField, but I cant to CompField to CompForm.
I did a sandbox with that working:
https://codesandbox.io/s/n0yq3jyz7p
It's good that I'm doing? or is better that I use Vuex? Or other way?. Any suggestion is welcome :D
The idea es make a form with a lots of field type dynamic and create a form very easy way.
Thanks everyone.
Hi I am looking for a solution for two way binding in Vue.js 2. I found a answer here about two way binding but it is in Vue.js 1. I tried to work it in Vue.js 1. But it didn't work. Can anyone help me here.
Why I want that?
A - I have a contenteditable div and a span tag inside which is shows a variable with v-html. But I want some functions to call when some edit happens. #change and #keyup don't work with span in vuejs 1. So I moved to custom directives.
To support something like this in vue2.0: as suggested by Evan You in forum here is to put these kind of functionality in a component and to reuse the same functionality on multiple components you can extract it into a shared mixin.
My suggestion is that the logic should be handled inside the component. In 2.0 v-model can work on components, e.g. https://github.com/vuejs/vue/blob/next/examples/select2/index.html
If you want to reuse the same logic on multiple components you can extract it into a shared mixin.