With “select all icon” you mean the checkbox in the table head that appears when you set selection="multiple" on the QTable, right?
I don’t know how to modify that, but you could use an external button and set the selected property to your whole table data array.
<q-table
:data="tableData"
selection="multiple"
:selected.sync="selected"
....
</q-table>
<q-btn label="click me" @click="buttonClicked" />
{
buttonClicked() {
this.selected = this.tableData;
}
}
You are right, there is indeed not much difference at for this animation duration.
I have now tried out a few options and I came to the conclusion that it definitely should be easeOutCubic (see https://easings.net/de#easeOutCubic ). At least in my opinion.
I have made a little demonstration: https://jsfiddle.net/uvz4gam3/ (don’t look at the code; only consider the result window)
There you can see (when you switch the tabs) some different easing curves:
If you would change the default transition to that, I would be super happy
Does it work? What @jraez said should help.
If you really want to use the router, you can do that, too.
The code you showed is in a boot file, right? So I think your this.$router.push('/login') call doesn’t work because this.$router is not defined. Normally, you write that in a Vue component, where this refers to the component - but you are in a boot file.
This is how you can do it:
import axios from "axios"
export default ({ Vue, router }) => { // <-------- This is where the `router` comes from
Vue.prototype.$axios = axios;
// ... (your request interceptor here)
axios.interceptors.response.use(response => {
return response;
}, error => {
if (error.response.status === 401) {
// ...
router.push("/login"); // <---- note there is no `this`
}
// ...
});
}
This is not a problem with QTable, but with Vue’s reactivity system.
Its a common pitfall and thankfully this will be improved when Vue 3.0 comes out (I think).
You can read about it here: https://vuejs.org/v2/guide/reactivity.html#Change-Detection-Caveats
The example in the link deals with exactly your problem: You initialize your objects in this.prefixes as objects having the properties timelines and prefix, so they are reactive automatically (that is Vue sets up it’s change-detection-system for them).
Then you assign a new property rpki using this.prefixes[key].rpki = '1' – this is not reactive in Vue 2.x !! So when you change that property later, Vue doesn’t notice it.
One way to solve your problem is by explicitly telling Vue that your objects have a new property. For this, Vue provides an alternative way of assigning values to object properties:
In refreshAPwidget(), replace
this.prefixes[key].rpki = '1'
with:
this.$set(this.prefixes[key], 'rpki', '1')
On a similar note, it is better to write this.$delete(this.prefixes[key], 'timelines') instead of delete this.prefixes[key].timelines, but this doesn’t affect your example.
Yes. If you write your options array as a computed property, you can do this:
computed: {
options() {
return [
{ label: 'Google', value: 'GOOGLE' },
{ label: 'Facebook', value: 'FACEBOOK' },
{ label: 'Twitter', value: 'TWITTER' },
{ label: 'Apple', value: 'APPLE', disable: this.selected === 'GOOGLE' },
{ label: 'Oracle', value: 'ORACLE' }
];
}
}
Making columns a computed property should do the trick
Man, that sounds serious 
Thank you for telling us.
I hope he takes as much time as he needs so that he gets well soon!
Awesome! Looking forward to it! 
Does it work? What @jraez said should help.
If you really want to use the router, you can do that, too.
The code you showed is in a boot file, right? So I think your this.$router.push('/login') call doesn’t work because this.$router is not defined. Normally, you write that in a Vue component, where this refers to the component - but you are in a boot file.
This is how you can do it:
import axios from "axios"
export default ({ Vue, router }) => { // <-------- This is where the `router` comes from
Vue.prototype.$axios = axios;
// ... (your request interceptor here)
axios.interceptors.response.use(response => {
return response;
}, error => {
if (error.response.status === 401) {
// ...
router.push("/login"); // <---- note there is no `this`
}
// ...
});
}
I’m facing the same problem. Company color is a dark brown… :|
My solution is: When I toggle darkmode on/off, I overwrite the colors using setBrand("primary", colorBasedOnDarkmodeSetting) and so on
The function is described here: https://quasar.dev/quasar-utils/color-utils
With “select all icon” you mean the checkbox in the table head that appears when you set selection="multiple" on the QTable, right?
I don’t know how to modify that, but you could use an external button and set the selected property to your whole table data array.
<q-table
:data="tableData"
selection="multiple"
:selected.sync="selected"
....
</q-table>
<q-btn label="click me" @click="buttonClicked" />
{
buttonClicked() {
this.selected = this.tableData;
}
}
@MKramer said in How to handle await/promise of async websocket object?:
The port of that server can change, so I created a global variable (which is defined in index.template.html, so it does not get renamed by the build process)
I’m afraid I don’t understand. What do you mean with getting renamed by the build process?
Why is your port number not available upon app start? Does it change over time or something?
Of course, the frontend somehow needs to know what port number the backend is running on and so on. But normally, it doesn’t need to wait for it… it should know value right away, for example using an environment variable.
Why do you need it to be asynchonous?
No need for async await.
In getReminder() replace:
documentClient.scan(params, function(err, data) {
...
With:
documentClient.scan(params, (err, data) => {
...
The difference is, that in a function using the function keyword, this has a different meaning as in a function using the arrow syntax.
You just discovered why arrow functions are so great – everything inside works as one would expect 
If you are interested in more details, here is an article about it: https://medium.com/free-code-camp/learn-es6-the-dope-way-part-ii-arrow-functions-and-the-this-keyword-381ac7a32881#.59q9th108
That should solve your error. You’ll see, everything with the iteration and with how you are using .push() is fine.
@felice The error tells you that you are calling the .push function on something that is undefined. You don’t need a workaround, you need to call the function on the right object (that is, the array) 
You were on the right track, it should work the way you did, except with .push instead of re-assigning a value to the property (what I said above).
Seems like there is some other problem with your code, but I can’t do much with what you showed us.
(3): Disabling expansion could be achieved with the following:
<q-tree
...
:expanded.sync="expanded"
>
computed: {
expanded: {
get() {
// return all keys
},
set(value) {
// do noting
}
}
}
For the other points: It sounds like you are describing the “strict” tick-strategy with the following adjustment:
ticked propertyIn the code snippet that you provided, you are not using the .push method. In each iteration you are overwriting tableData with a single object.
Push is used like this:
this.tableData.push({ ... })