profile
viewpoint
Eduardo San Martin Morote posva Freelance Paris https://twitter.com/posva Member of the @vuejs core team Speaker, trainer. From 🇪🇸, lives in 🇫🇷

posva/catimg 735

:squirrel: Insanely fast image printing in your terminal

Gozala/selfish 158

Class-free, pure prototypal inheritance

brillout/awesome-vue-refactor 27

A curated list of awesome things related to Vue.js

ArthurSonzogni/CppBot 13

Portable C++ tools for bot creations : keyboard and mouse event generations, screen capture !

posva/clipboard-text 11

Simple and small copy-text-to-the-clipboard-utility with IE11 support

posva/configure-script 2

:zap: Simple script to generate Makefiles for your project. It's mainly aimed for C/C++ but can be adapted to other languages

bemug/spark-make 1

A Spark implementation of distributed Makefile

posva/2d-collisions 1

Collision for 2D using the SAT theorem with Rectangles

posva/awesome-latex-workspace 1

:bookmark_tabs: Watcher + commit based diff generator

issue closedvuejs/vue-router

$route incorrect for view when inactive (in combination with keep-alive)

Version

3.1.3 (and up to 3.1.5 as well)

Reproduction link

https://jsfiddle.net/mdvL4276/29

Steps to reproduce

  1. Open the JsFiddle
  2. Click 'navigate to random'

What is expected?

The list that shows all children of the App.vue should all have their own correct id. The id is a computed property that is computed the following: return this.$route.params.id

In the JsFiddle I also implemented a workaround myself. This is done as follows:

  data() {
    return {
      'routeFixed': this.$route
    }
  },

This way the routeFixed property will always have the correct $route info available.

What is actually happening?

The $route param changes when the view becomes inactive. In my opinion it should remained fixed as it is linked to that specific view.


This can cause all sorts of problems and issues. For example, I have a computed property based on one of the $route.params variables. If I then make a watcher on that computed property, it will actually execute the code within that watcher's handler (because it changed from some value to undefined). Of course this can be worked around by adding a check to see if the variable is undefined, but I don't think that should be necessary. Besides that it can cause problems when you use that computed property in a Vue plugin that does not check for undefined for example.

<!-- generated by vue-issues. DO NOT REMOVE -->

closed time in 8 hours

tafelnl

issue commentvuejs/vue-router

$route incorrect for view when inactive (in combination with keep-alive)

See https://github.com/vuejs/vue/issues/5477

tafelnl

comment created time in 8 hours

IssuesEvent

issue commentvuejs/vue

why my custom elements such as 'view', 'text' are not show?

Oops, didn't mean to close it but I also forgot to add the labels.

They are not HTML elements, they are for SVG, I think that's why they are not visible. Maybe we could detect if the element is inside of an SVG and change based on that. Either way, Using non-standard HTML elements is something that should be avoided.

aweiu

comment created time in 11 hours

issue commentvuejs/vue-router

Design for Vue 3

@hareku it's published 🙂 Keep in mind the naming of exports is subject to change

jods4

comment created time in 12 hours

issue closedvuejs/vue

why my custom elements such as 'view', 'text' are not show?

Version

2.6.11

Reproduction link

https://jsfiddle.net/t9fyx82u/5/

Steps to reproduce

nothing to do.

What is expected?

view and text will be shown, just like view2 and text2.

What is actually happening?

view and text in the #app are not show,but they can be displayed outside of #app

<!-- generated by vue-issues. DO NOT REMOVE -->

closed time in 12 hours

aweiu

issue commentvuejs/vue

why my custom elements such as 'view', 'text' are not show?

text and view are reserved tags for SVG. It has a special meaning and that's why it shouldn't be used as a component name

aweiu

comment created time in 12 hours

pull request commentvuejs/vue-next

fix(runtime-core): convert to an Error instance for ErrorCapturedHook

Maybe unknown, but that's a completely different change

hareku

comment created time in 12 hours

pull request commentvuejs/vue-next

fix(runtime-core): convert to an Error instance for ErrorCapturedHook

I don't think it's a good idea to transform the error thrown by the user. They are responsible to throw valid errors but they could also be throwing anything and expect to get back that same thin in the error handler

hareku

comment created time in 15 hours

issue closedvuejs/vue

Impossible to select the child elements of the table when filled with function

Version

2.6.11

Reproduction link

https://jsfiddle.net/lucasmsoares96/2x0mpLt7/1/

Steps to reproduce

open the browser console

What is expected?

the browser console is expected to show the childre elements of the selected table.

What is actually happening?

Child elements are not selected.


child elements are selected when the items attribute is defined within data(), but not when items are returned from a function

<!-- generated by vue-issues. DO NOT REMOVE -->

closed time in 18 hours

lucasmsoares96

issue commentvuejs/vue

Impossible to select the child elements of the table when filled with function

Hi, thanks for your interest but Github issues are for bug reports and feature requests only. You can ask questions on the forum, the Discord server or StackOverflow.


This is related to bootstrap vue. Also, you are accessing table[1] but table has only one element

lucasmsoares96

comment created time in 18 hours

issue commentvuejs/vue-router

Design for Vue 3

@mehcode yeah, this time it's possible because we only have named exports

jods4

comment created time in a day

issue commentvuejs/vue

Wanna see my hot pics?💋💋💋

@VISWESWARAN1998 please, don't post comments on the spam, it just adds to the spam. You can instead report the user to Github, that could help banning them

akdnfbf

comment created time in 2 days

issue commentvuejs/vue-router

Design for Vue 3

Probably something like createWebHistory and createWebHashHistory. I rather not use html5 in the name because it relates to the version of html and doesn't feel right for a name

I was aware of the problem, and we will likely expose functions named useRouter and useRoute that do the injection for us. It's nice you found a solution to the problem, I'm curious about where to put that reference comment though

jods4

comment created time in 2 days

pull request commentvuejs/composition-api

refactor: rename createComponent as defineComponent

@sodatea I merged master into the branch. I used unknown instead of any

cexbrayat

comment created time in 2 days

PR opened vuejs/composition-api

chore: remove node 8

Removing node 8 since it's not longer supported

+1 -1

0 comment

1 changed file

pr created time in 2 days

create barnchvuejs/composition-api

branch : chore/remove-node-8

created branch time in 2 days

push eventcexbrayat/composition-api

Katashin

commit sha 1b58a6745836deff1b0dd60715cfe1331e5d0ff4

fix: avoid accessing undeclared instance fields on type level (#189) * fix: avoid accessing undeclared instance fields on type level * fix: inherit vue constructor type for constructor proxy fix #187 fix #185

view details

Eduardo San Martin Morote

commit sha a91c9457064ee45372d5a584b0acf8bc5f16452d

Merge branch 'master' into refactor/define-component

view details

push time in 2 days

issue closedvuejs/composition-api

The component created by createComponent, which calls the install method to report an error

// tree.tsx

export default createComponent({
    name: 'Tree',
    ...
})
// index.tsx
import Tree from './tree';

/* istanbul ignore next */
Tree.install = function(Vue) {
  Vue.component(Tree.name, Tree);
};

export default Tree;

报错:install method not exist

closed time in 2 days

GouJieShinee

issue commentvuejs/composition-api

The component created by createComponent, which calls the install method to report an error

That is normal, there is no install property in a component. You are free to add it for vue plugins but you will have to modify the type of Tree to include it so it is type safe with Vue.use

GouJieShinee

comment created time in 2 days

issue closedvuejs/vuefire

Specifiy a constructor to use when binding collections

I have a collection of contacts in firestore, with a firstname and a lastname.

Thanks to vuexfire, I can easily sync this collection with my app , and vuexfire is doing intelligent "add / remove / update" operations without having to completely destroy and recreate the whole dbContacts array everytime.

But in my app, instead of accessing the raw {firstname, lastname} object, I would like to use a class person, so I can have access to the method getFullName() for example.

Today, I have a vuex getter which loops over the dbContacts array to populate and return the classContacts array. Thanks to vuex, the result is cached, but as far as I know, every time 1 contact is modified in the dbContacts array, then the whole classContacts array is recomputed.

Wouldn't be possible to specify to vuexfire that the synced array should create objects using a given constructor, so it can surgically add/remove/update only the contact that has been modified in the db?

closed time in 2 days

Pitouli

issue commentvuejs/vuefire

Specifiy a constructor to use when binding collections

Checkout the serialize option: https://vuefire.vuejs.org/api/vuefire.html#options-serialize

Pitouli

comment created time in 2 days

issue closedvuejs/composition-api

createComponent create vue component, how to call self component

Components created through createComponent:

// tree-node.vue
interface treeProps {
    node: { label: string, value: string|number, children: Array<any> },
    .....
}
export default createComponent({
    name: 'TreeNode',
    setup( props: treeProps ) {
        return () => {
            <div>
                <span>{props.label}</span>
                 // here i want to call <TreeNode> component self, how to call
            </div>
        }
    }
    ...
})

i use typescript + vue3.x. How to invoke the component itself to implement the circular invocation

closed time in 2 days

GouJieShinee

issue commentvuejs/composition-api

createComponent create vue component, how to call self component

Hi, thanks for your interest but Github issues are for bug reports and feature requests only. You can ask questions on the forum, the Discord server or StackOverflow.


This is related to jsx. I imagine there is a syntax that allows you to use TreeNode (maybe tree-node) but I'm not aware of it

GouJieShinee

comment created time in 2 days

pull request commentvuejs/vue

fix(ssr): ignore empty text vnode when hydrating (fix #11109)

for GitHub: this closes #11109

deqwin

comment created time in 3 days

Pull request review commentvuejs/vue

fix(ssr): ignore empty text vnode when hydrating (fix #11109)

 describe('vdom patch: hydration', () => {       expect(dom.children[0].className).toBe('bar')     }).then(done)   })++  // #11109+  it('should not warn failed hydration when there are some empty text vnode in children', () => {
  it('should not fail hydration with empty text vnodes children', () => {
deqwin

comment created time in 3 days

issue commentvuejs/composition-api

Error in "Watching Multiple Sources"

On the first run, the old value is undefined, so the error makes sense. However, the typings are not right (https://github.com/vuejs/vue-next/issues/719) and they should follow the same fix as https://github.com/vuejs/vue-next/commit/c6a9787941ca99877d268182a5bb57fcf8b80b75

alekseymvt

comment created time in 3 days

issue commentposva/vue-promised

[Feature] CDN mode

as you figured out, the answer is yes :)

ibrahimBeladi

comment created time in 4 days

issue commentvuejs/vue-next

Compiler crash on v-if on svg or template

Have you tried using the current master version? It seems to work using the template explorer

jods4

comment created time in 4 days

issue commentvuejs/vue

Functional components fail to transition without a unique tag and key

perhaps mark it similar to how transition-group warns of missing keys? Is that possible?

That wouldn't be possible because the warning in transition-group always appear. Here we need some way of deciding when to show the warning and even in those cases, reusing nodes could be intentional.

Let's move this to docs then

robmadole

comment created time in 4 days

issue closedvuejs/composition-api

How can I use asynchronous methods in setup()

<script lang="ts">
import { createComponent } from "@vue/composition-api";

import { SplashPage } from "../../lib/vue-viewmodels";

export default createComponent({
  async setup(props, context) {
    await SplashPage.init(2000, context.root.$router, "plan", "login");
  }
});
</script>

ERROR: "setup" must return a "Object" or a "Function", got "Promise"

closed time in 4 days

shaolizhi1234

issue commentvuejs/composition-api

How can I use asynchronous methods in setup()

the async setup requires using Suspense which doesn't exist in Vue 2. The async setup is only available in Vue 3

shaolizhi1234

comment created time in 4 days

issue commentvuejs/vue

Functional components fail to transition without a unique tag and key

I'm not sure if this is a bug: functional component not having an instance, they look more like raw div elements, in which case, not having a key will not trigger a transition because Vue reuses the element (this is in the doc), which is what you are observing.

The reason a key doesn't seem to work is because functional components do not inherit attributes by default, it has to be done manually:

export default {
      functional: true,
      render: (h, context) => h("div", { ...context.data }, "One")
}

When using templates, it also has to be explicitly passed:

<div :key="data.key">One</div>
robmadole

comment created time in 4 days

issue commentvuejs/vuefire

[DOCS] Inform user that the site is a PWA and can work offline

Following the tip at the top should allow anybody to do a PR: https://v1.vuepress.vuejs.org/plugin/official/plugin-pwa.html

nainardev

comment created time in 5 days

issue commentvuejs/vue-router

Design for Vue 3

Thanks! I'm fixing the types and publishing a new version

For the other 3 points: the idea behind always passing history is to allow the history to be customized and also to be tree-shakeable. Because of that, I don't think there will be a default (there is an RFC about changing the default btw) but we will likely keep using the hash for beginner examples and explain why you should use the HTML5 one in real apps (see the mentioned RFC for the rationale)

jods4

comment created time in 5 days

issue closedvuejs/composition-api

How to use it in nuxt project

I am new to nuxt. So i am not sure how to use this in nuxt project.

Can anyone explain me how to use it.

closed time in 5 days

akvaliya

issue commentvuejs/composition-api

How to use it in nuxt project

Add a plugin: plugins/vue-composition.js

import Vue from 'vue'
import VueCompositionApi from '@vue/composition-api'

Vue.use(VueCompositionApi)

Add the plugin to nuxt.config.js

plugins: ['~/plugins/vue-composition']
akvaliya

comment created time in 5 days

PR closed vuejs/vue

Refactored dedupeHooks

Using the new Set API makes it faster and more readable.

<!-- Please make sure to read the Pull Request Guidelines: https://github.com/vuejs/vue/blob/dev/.github/CONTRIBUTING.md#pull-request-guidelines -->

<!-- PULL REQUEST TEMPLATE --> <!-- (Update "[ ]" to "[x]" to check a box) -->

What kind of change does this PR introduce? (check at least one)

  • [ ] Bugfix
  • [ ] Feature
  • [ ] Code style update
  • [X] Refactor
  • [ ] Build-related changes
  • [ ] Other, please describe:

Does this PR introduce a breaking change? (check one)

  • [ ] Yes
  • [X] No

If yes, please describe the impact and migration path for existing applications:

The PR fulfills these requirements:

  • [X] It's submitted to the dev branch for v2.x (or to a previous version branch), not the master branch
  • [ ] When resolving a specific issue, it's referenced in the PR's title (e.g. fix #xxx[,#xxx], where "xxx" is the issue number)
  • [X] All tests are passing: https://github.com/vuejs/vue/blob/dev/.github/CONTRIBUTING.md#development-setup
  • [ ] New/updated tests are included

If adding a new feature, the PR's description includes:

  • [ ] A convincing reason for adding this feature (to avoid wasting your time, it's best to open a suggestion issue first and wait for approval before working on it)

Other information:

+1 -7

1 comment

1 changed file

OddDev

pr closed time in 5 days

pull request commentvuejs/vue

Refactored dedupeHooks

Thank you but when changing code for performance reasons, please provide with benchmarks that backup your case. Also keep in mind the code must be able to run on IE9, new Set(iterable) does not work on IE

OddDev

comment created time in 5 days

issue closedvuejs/vue

prop 的值更新不及时

Version

2.6.10

Reproduction link

https://codepen.io/notomorow/pen/abOdVPE?editors=1010。

Steps to reproduce

https://codepen.io/notomorow/pen/abOdVPE?editors=1010。当父组件里的key加1时,立即调用子组件的alert方法,按预想此时子组件alert里的val应该更新了,但是并没有。

What is expected?

当父组件里的key加1时,立即调用子组件的alert方法,按预想此时子组件alert里的val应该更新了。

What is actually happening?

子组件alert的this.val 还是老的

<!-- generated by vue-issues. DO NOT REMOVE -->

closed time in 5 days

notomorow

issue commentvuejs/vue

prop 的值更新不及时

This is expected because the value takes a tick to propagate to the children. You can wait one tick before calling alert:

this.value += 1
await this.$nextTick()
this.$refs.child.alert()
notomorow

comment created time in 5 days

issue closedvuejs/vue-loader

Data-Attributes on Scoped Nested SCSS not applied to correct elements

Version

15.7.2

Reproduction link

https://jsfiddle.net/yj9w7q6a/ I could not get an exact reproduction because jsfiddle doesn't use .Vue file extentions required by vue-loader. But this is the code to reproduce.

Steps to reproduce

Let's say I have this SCSS in a component marked to have Scoped css with a .scss file referenced through the src attribute.

<style scoped lang="scss" src="./styles.scss"></style>

// Styles.scss
#custom-menu {
    z-index          : 1000;

    ol {
        padding     : 0;

        li {
            margin     : 0;
    }

}

This gets incorrectly rendered as

#custom-menu[data-v-460e287f] {
    z-index          : 1000;
}

#custom-menu ol[data-v-460e287f] {
    padding     : 0;
}

#custom-menu ol li[data-v-460e287f] {
    margin     : 0;
}

And here is the HTML

<div data-v-460e287f id="custom-menu">
   <ol>
        <li class="context-menu-item">Item</li>
   </ol>
</div>

Notice how the data attribute is added to the #cusom-menu element in the HTML, but in the CSS it's added to the last selector in the nested SCSS. So the styles do not render correctly with the HTML as generated.

Solution: Data attribute should be added to the root element of a nested SCSS tag, not the individual elements nested in it.

What is expected?

Scoped scss should render correct data-attributes

What is actually happening?

Incorrectly positioned data-attribtues compared to generated HTML markup

<!-- generated by vue-issues. DO NOT REMOVE -->

closed time in 5 days

IAMtheIAM

issue commentvuejs/vue-loader

Data-Attributes on Scoped Nested SCSS not applied to correct elements

The CSS generated is correct and the HTML depends on what the component was but it cannot be verified like that. You can provide an example o code sandbox to show that, it should also go into Vue-loader repo instead

IAMtheIAM

comment created time in 5 days

issue commentvuejs/vue

Global event bus sets listeners to null on bad code

That fix breaks existing usage by not allowing removing all listeners attached to an event with $off('event') on root instances or simple buses new Vue() (https://github.com/vuejs/vue/pull/11105#issuecomment-585822130) Ordering matters when attaching events to a Bus and relying on component creation and removal don't play nicely, mounting and unmounting does though. Changing the order would also be a breaking change

hawkeye64

comment created time in 5 days

issue closedvuejs/vue-router

Design for Vue 3

What problem does this feature solve?

The roadmap for Vue 3 says it will release Q1 2020 and the core lib is already very usable. I think now is the right time to port vue-router, which is a must-have for many apps. The exercise may provide interesting feedback on Vue3 public APIs.

I could help porting the code but I'm unsure of some design decisions.

What does the proposed API look like?

1. Setup

install could be an instance function on VueRouter so that one could register it like that:

let router = new VueRouter(/* routes, options */);  // <- actual, usable router
createApp(MyApp)
  .use(router)
  .mount('#app');

What install does is:

  • Register global components router-link and router-view;
  • Provide value Router at the root of application.
  • :question: Do we want to provide a Route ref as well? It's available through the router object.

I'll talk more about injecting value next. If someone wants more control (e.g. use different name for components or not register them globally), those tasks can easily be made manually instead of using .use(router).

2. Accessing the router

There is no global mixins $router, $route anymore.

If a component (userland, or internally in router-view and router-link) needs to access the router, e.g. to navigate, it injects the router in setup: let router = inject('Router').

The route can be found on the router, or could be provided as Route (ref). Nesting routers can be done be re-providing those keys.

3. Guards

This is what I'm having most trouble with. Currently vue-router does some ugly hacks to get hold of component instances that are navigated to/from, in order to call beforeRouteEnter, beforeRouteUpdate and beforeRouteLeave.

I'm hoping the new API could look something like:

import { beforeRouteLeave } from 'vue-router';

export default {
  setup() {
    beforeRouteLeave(() => ...);
  }
}

but I'm not clear about how fine details would work. Such as:

  • where/how is the component defined in routing actually created?
  • is setup always called, even when using keep-alive?

With some feedback on the design and a few pointers for the last point, I can have a try at porting this component.

BTW: 300Mo of dependencies to build a 20Ko lib is crazy :(

<!-- generated by vue-issues. DO NOT REMOVE -->

closed time in 5 days

jods4

issue commentvuejs/vue-router

Design for Vue 3

Hello, it's great you want to help, we could definitely use some help! However I need you to wait a little bit more (few weeks) as there is already a lot of work already done for the next version of vue router and porting the current version would be a waste of time. The truth is you can already experiment with it at https://www.npmjs.com/package/@posva/vue-router-next (take a look at the code in the playground folder for an example) but the source code is still going under some changes and will be public very soon.

Good news is 1 and 2 are already that way. For 3, the api is likely to be onBeforeRoute* but we still need to figure out some changes regarding keep alive and suspense (specifically for beforeRouteEnter)

If you find things while using the package linked above, please post them here (even if the issue is closed) and ping me until the repo for vue-router-next is public and discussions can happen there with pointers at the source code as well

jods4

comment created time in 5 days

issue commentvuejs/vue-router

Cannot get /...

Remember we have the forum and the Discord chat to ask quick questions!

awitherow

comment created time in 5 days

issue commentvuejs/vue

Syntax suggestion when passing props to components

Please check the discussions, the arguments provided apply for both of your suggestions

AndreSouzaAbreu

comment created time in 5 days

PR closed vuejs/vue

fix(core): remove event only when it is not $root

<!-- Please make sure to read the Pull Request Guidelines: https://github.com/vuejs/vue/blob/dev/.github/CONTRIBUTING.md#pull-request-guidelines -->

<!-- PULL REQUEST TEMPLATE --> <!-- (Update "[ ]" to "[x]" to check a box) -->

What kind of change does this PR introduce? (check at least one)

  • [ x] Bugfix
  • [ ] Feature
  • [ ] Code style update
  • [ ] Refactor
  • [ ] Build-related changes
  • [ ] Other, please describe:

Does this PR introduce a breaking change? (check one)

  • [ ] Yes
  • [x] No

Other information: Look #11104

+1 -1

1 comment

1 changed file

jesusvilla

pr closed time in 5 days

pull request commentvuejs/vue

fix(core): remove event only when it is not $root

See https://github.com/vuejs/vue/issues/11104#issuecomment-585821293

I'm concerned this code doesn't break any test. The Vue instance being the $root doesn't mean it shouldn't remove all event listeners when no function is provided. Maybe you want to add a test case for that? 🙂 I haven't checked but I guess there are tests for instances but none using a plain Vue instance as a bus

jesusvilla

comment created time in 5 days

issue commentvuejs/vue

Global event bus sets listeners to null on bad code

The reason this happens is because QChild2 is destroyed before Qchild1 is created, removing all listeners added by Qchild1. This is not a bug. Attaching the event on mounted instead of created allows you to get around this

hawkeye64

comment created time in 5 days

issue closedvuejs/vue

Global event bus sets listeners to null on bad code

Version

2.6.11

Reproduction link

https://codepen.io/Hawkeye64/pen/bGdENZo?editors=1010

Steps to reproduce

The link has the steps. Basically, you need two components that are subsequently created and destroyed. The first component registers an event with the global event bus and de-registers it when destroyed. The second component, only has the de-registration in it's BeforeDestroy. When going from 1st component, to second component, then back to first component, the first component is created, the event is registered, the second component is destroyed and array of listeners for that event is set to null when the de-registration is done. I know this is bad coding. But could happen to anyone. This took us two days to figure out. I wanted to learn more about the issue, so wrote the codepen to illustrate the issue and to test various versions of Vue. This issue does not occur in v2.5.2 or earlier. It started with v2.5.3 and is present in latest (v2.6.11).

What is expected?

Vue should keep track of $on/$off listeners and ignore $off if no corresponding $on - at least don't set the listeners array to null. With the link to reproduce the bug, I have done the latest (2.6.11) and back to 2.5.3 - this is NOT a bug in 2.5.2 as the reproduction works in that version, so quite possibly something changed.

What is actually happening?

The listeners array for the event is set to null. Therefore, no other listeners can receive the event messages from the global event bus.


Before a jr dev left our company, he was doing some clean up. In the mounted() he remove some code this.$root.$on('alarms:new', this.myFunc) but forgot to remove in the BeforeDestroy this this.$root.$off('alarms:new', this.myFunc). Subsequently, we stopped getting this particular event with other components. What we found is that the innocuous code, when calling $root.$off does not have a matching $root.$on, so the event array for the listeners is set to null.

<!-- generated by vue-issues. DO NOT REMOVE -->

closed time in 5 days

hawkeye64

startedJohannesLamberts/vue-state-composer

started time in 6 days

issue closedvuejs/vue-router

Aborting navigation throws `undefined`

Version

3.1.3

Reproduction link

https://jsfiddle.net/0ukqxgho/1/

Steps to reproduce

Click the /foo button, check the browser console for errors

What is expected?

An Error be thrown.

What is actually happening?

undefined is thrown.


The docs specify that if a navigation is aborted, then the promise returned by $router.push is rejected. This was causing me grief because I was trying to track down where an Uncaught (in promise) undefined error was being thrown - would have been helpful to have been able to narrow down the error faster.

<!-- generated by vue-issues. DO NOT REMOVE -->

closed time in 6 days

diachedelic

issue commentvuejs/vue-router

Aborting navigation throws `undefined`

See https://github.com/vuejs/vue-router/pull/3047

diachedelic

comment created time in 6 days

issue closedvuejs/vue-router

Having store accessible from router on initialization depends on order of use statements

Version

3.1.5

Reproduction link

https://codesandbox.io/s/vue-routing-example-jf31j

Steps to reproduce

The codesandbox works fine as is. However, if you change the order of the imports to

import router from "./router";
import store from "./store";

as described in the code, the router.beforeEach will be unable to access the $store.

What is expected?

the store would work in the router, regardless of the order of Vue.use statements

What is actually happening?

The store is only initially accessible in router.beforeEach if Vue.use(Vuex) is called before Vue.use(Router);.

<!-- generated by vue-issues. DO NOT REMOVE -->

closed time in 6 days

719media

issue commentvuejs/vue-router

Having store accessible from router on initialization depends on order of use statements

This is because of the way these two plugins are installed and how the injection is done in Vuex: by checking on the parent on a beforeCreate. Unfortunately we cannot change that so the router should come last, if you want the navigation guard to happen on the first navigation. Given the very reasonable ordering working properly, I don't think there is a need to allow a different ordering. It won't be a problem in the next version though

719media

comment created time in 6 days

issue commentvuejs/vue

Syntax suggestion when passing props to components

Duplicate of https://github.com/vuejs/vue/issues/5835

AndreSouzaAbreu

comment created time in 6 days

issue commentvuejs/vue-router

Yarn v2 compat: add vue to peerDependencies

for anybody doing the PR, please include clear steps about how to test locally with links to instructions to use yarn v2 as I personally don't use it

AlexandreBonaventure

comment created time in 6 days

issue closedvuejs/vue

For input checkboxes v-model with additional @input event handlers v-model is not set to true-value and false-value bindings

Version

2.6.11

Reproduction link

https://jsfiddle.net/ventralnet/1ew78c93/2/

Steps to reproduce

Open up the console, click the checkbox. You will see two console messages logged on @input event. this.selectedValue is logged immediately and it is blank, then in the next event loop it properly has true-value

Is this a bug?

What is expected?

this.selectedValue is set to true-value attribute

What is actually happening?

this.selectedValue is blank until next event loop

<!-- generated by vue-issues. DO NOT REMOVE -->

closed time in 7 days

ventralnet

issue commentvuejs/vue

For input checkboxes v-model with additional @input event handlers v-model is not set to true-value and false-value bindings

This is due to timing difference between the input and change (the one you should be listening to) events. This is something you should avoid relying on as browsers could behave differently. The event that should be used for a checkbox is change though. Using that events works fine

ventralnet

comment created time in 7 days

push eventposva/path-rank-tester

Eduardo San Martin Morote

commit sha b32ecbc119115a78622140c9a35ed275326b2827

change message

view details

push time in 7 days

issue closedvuejs/composition-api

Augmenting ComponentRenderProxy

With options API, I used to inject "global" variables into the render context with:

Vue.mixin({
	computed: {
		$store: () => store,
	},
})

declare module 'vue/types/vue' {
	interface Vue {
		$store: Store
	}
}

and then refer to it with:

<template>
  <div>store = {{ $store }}</div>
</template>

How would I do the same with composition API? node_modules/@vue/composition-api/dist/component/component.d.ts seems to be exporting a non-augmentable type ComponentRenderProxy with hardcoded set of properties:

export declare type ComponentRenderProxy<P = {}, S = {}, PublicProps = P> = {
    $data: S;
    $props: PublicProps;
    $attrs: Data;
    $refs: Data;
    $slots: Data;
    $root: ComponentInstance | null;
    $parent: ComponentInstance | null;
    $emit: (event: string, ...args: unknown[]) => void;
} & P & S;

so the template fails to validate:

image

Any ideas?

Also (I'm sure I'm missing something!) why doesn't ComponentRenderProxy simply extend Vue?

closed time in 7 days

IlyaSemenov

issue commentvuejs/composition-api

Augmenting ComponentRenderProxy

Use provide/inject for that by providing the store at the root of the application and injecting wherever needed. There is more info at https://github.com/vuejs/rfcs/pull/117 FYI the global mixin with a computed property is a security vulnerability when doing SSR (leads to sharing the store instance among different request). The validation message comes from Vetur, the VScode plugin, you might want to get more info from them first to see if there is anything we can do to to help them with that validation message

IlyaSemenov

comment created time in 7 days

pull request commentvuejs/vue-router

fix(ssr): Memory leak in poll method, take 2 (fix #2606)

@ronald-d-rogers thank you for that! I haven't forgotten about this PR and I will try to review it in a few weeks

ronald-d-rogers

comment created time in 7 days

issue closedvuejs/vue

Unable to install vue cli

Version

2.6.11

Reproduction link

https://github.com/vuejs/vue-cli/issues/5181

Steps to reproduce

Vue global installation fails with 404 Not Found - GET https://registry.npmjs.org/error-ex

What is expected?

Install vue cli globally

What is actually happening?

Unable to install because of a dependency not found

<!-- generated by vue-issues. DO NOT REMOVE -->

0 info it worked if it ends with ok 1 verbose cli [ 1 verbose cli '/usr/local/Cellar/node@12/12.15.0/bin/node', 1 verbose cli '/usr/local/bin/npm', 1 verbose cli 'install', 1 verbose cli '@vue/cli' 1 verbose cli ] 2 info using npm@6.13.7 3 info using node@v12.15.0 4 verbose npm-session fa4cf840264f3567 5 silly install loadCurrentTree 6 silly install readLocalPackageData 7 http fetch GET 304 https://registry.npmjs.org/@vue%2fcli 756ms (from cache) 8 silly pacote tag manifest for @vue/cli@latest fetched in 768ms 9 timing stage:loadCurrentTree Completed in 805ms 10 silly install loadIdealTree 11 silly install cloneCurrentTreeToIdealTree 12 timing stage:loadIdealTree:cloneCurrentTree Completed in 0ms 13 silly install loadShrinkwrap 14 timing stage:loadIdealTree:loadShrinkwrap Completed in 0ms 15 silly install loadAllDepsIntoIdealTree 16 silly resolveWithNewModule @vue/cli@4.2.2 checking installable status 17 http fetch GET 200 https://registry.npmjs.org/boxen 31ms (from cache) 18 http fetch GET 200 https://registry.npmjs.org/didyoumean 26ms (from cache) 19 silly pacote range manifest for boxen@^4.1.0 fetched in 34ms 20 silly resolveWithNewModule boxen@4.2.0 checking installable status 21 silly pacote range manifest for didyoumean@^1.2.1 fetched in 30ms 22 silly resolveWithNewModule didyoumean@1.2.1 checking installable status 23 http fetch GET 304 https://registry.npmjs.org/@vue%2fcli-shared-utils 214ms (from cache) 24 silly pacote range manifest for @vue/cli-shared-utils@^4.2.2 fetched in 218ms 25 silly resolveWithNewModule @vue/cli-shared-utils@4.2.2 checking installable status 26 http fetch GET 304 https://registry.npmjs.org/envinfo 174ms (from cache) 27 silly pacote range manifest for envinfo@^7.5.0 fetched in 178ms 28 silly resolveWithNewModule envinfo@7.5.0 checking installable status 29 http fetch GET 304 https://registry.npmjs.org/cmd-shim 572ms (from cache) 30 http fetch GET 304 https://registry.npmjs.org/ejs 537ms (from cache) 31 http fetch GET 304 https://registry.npmjs.org/download-git-repo 541ms (from cache) 32 http fetch GET 304 https://registry.npmjs.org/debug 574ms (from cache) 33 http fetch GET 304 https://registry.npmjs.org/deepmerge 573ms (from cache) 34 http fetch GET 304 https://registry.npmjs.org/@vue%2fcli-ui-addon-widgets 581ms (from cache) 35 silly pacote range manifest for cmd-shim@^3.0.3 fetched in 580ms 36 silly resolveWithNewModule cmd-shim@3.0.3 checking installable status 37 silly pacote range manifest for ejs@^2.7.1 fetched in 546ms 38 silly resolveWithNewModule ejs@2.7.4 checking installable status 39 silly pacote range manifest for download-git-repo@^1.0.2 fetched in 550ms 40 silly resolveWithNewModule download-git-repo@1.1.0 checking installable status 41 http fetch GET 304 https://registry.npmjs.org/@vue%2fcli-ui-addon-webpack 587ms (from cache) 42 silly pacote range manifest for debug@^4.1.0 fetched in 585ms 43 silly resolveWithNewModule debug@4.1.1 checking installable status 44 silly pacote range manifest for deepmerge@^4.2.2 fetched in 584ms 45 silly resolveWithNewModule deepmerge@4.2.2 checking installable status 46 silly pacote range manifest for @vue/cli-ui-addon-widgets@^4.2.2 fetched in 592ms 47 silly resolveWithNewModule @vue/cli-ui-addon-widgets@4.2.2 checking installable status 48 silly pacote range manifest for @vue/cli-ui-addon-webpack@^4.2.2 fetched in 599ms 49 silly resolveWithNewModule @vue/cli-ui-addon-webpack@4.2.2 checking installable status 50 http fetch GET 304 https://registry.npmjs.org/fs-extra 215ms (from cache) 51 silly pacote range manifest for fs-extra@^7.0.1 fetched in 216ms 52 silly resolveWithNewModule fs-extra@7.0.1 checking installable status 53 http fetch GET 304 https://registry.npmjs.org/@vue%2fcli-ui 613ms (from cache) 54 silly pacote range manifest for @vue/cli-ui@^4.2.2 fetched in 617ms 55 silly resolveWithNewModule @vue/cli-ui@4.2.2 checking installable status 56 http fetch GET 304 https://registry.npmjs.org/commander 772ms (from cache) 57 silly pacote range manifest for commander@^2.20.0 fetched in 773ms 58 silly resolveWithNewModule commander@2.20.3 checking installable status 59 http fetch GET 304 https://registry.npmjs.org/js-yaml 217ms (from cache) 60 http fetch GET 304 https://registry.npmjs.org/globby 228ms (from cache) 61 http fetch GET 304 https://registry.npmjs.org/javascript-stringify 222ms (from cache) 62 http fetch GET 304 https://registry.npmjs.org/jscodeshift 215ms (from cache) 63 http fetch GET 304 https://registry.npmjs.org/isbinaryfile 226ms (from cache) 64 http fetch GET 304 https://registry.npmjs.org/import-global 233ms (from cache) 65 silly pacote range manifest for js-yaml@^3.13.1 fetched in 224ms 66 silly resolveWithNewModule js-yaml@3.13.1 checking installable status 67 http fetch GET 304 https://registry.npmjs.org/lodash.clonedeep 209ms (from cache) 68 silly pacote range manifest for globby@^9.2.0 fetched in 239ms 69 silly resolveWithNewModule globby@9.2.0 checking installable status 70 silly pacote range manifest for javascript-stringify@^1.6.0 fetched in 231ms 71 silly resolveWithNewModule javascript-stringify@1.6.0 checking installable status 72 silly pacote range manifest for jscodeshift@^0.7.0 fetched in 224ms 73 silly resolveWithNewModule jscodeshift@0.7.0 checking installable status 74 silly pacote range manifest for isbinaryfile@^4.0.0 fetched in 237ms 75 silly resolveWithNewModule isbinaryfile@4.0.4 checking installable status 76 silly pacote range manifest for import-global@^0.1.0 fetched in 243ms 77 silly resolveWithNewModule import-global@0.1.0 checking installable status 78 http fetch GET 304 https://registry.npmjs.org/lru-cache 213ms (from cache) 79 http fetch GET 304 https://registry.npmjs.org/inquirer 243ms (from cache) 80 silly pacote range manifest for lodash.clonedeep@^4.5.0 fetched in 221ms 81 silly resolveWithNewModule lodash.clonedeep@4.5.0 checking installable status 82 silly pacote range manifest for lru-cache@^5.1.1 fetched in 228ms 83 silly resolveWithNewModule lru-cache@5.1.1 checking installable status 84 silly pacote range manifest for inquirer@^6.3.1 fetched in 257ms 85 silly resolveWithNewModule inquirer@6.5.2 checking installable status 86 http fetch GET 200 https://registry.npmjs.org/shortid 20ms (from cache) 87 silly pacote range manifest for shortid@^2.2.15 fetched in 22ms 88 silly resolveWithNewModule shortid@2.2.15 checking installable status 89 http fetch GET 304 https://registry.npmjs.org/minimist 172ms (from cache) 90 silly pacote range manifest for minimist@^1.2.0 fetched in 173ms 91 silly resolveWithNewModule minimist@1.2.0 checking installable status 92 http fetch GET 304 https://registry.npmjs.org/slash 200ms (from cache) 93 http fetch GET 304 https://registry.npmjs.org/recast 206ms (from cache) 94 silly pacote range manifest for slash@^3.0.0 fetched in 205ms 95 silly resolveWithNewModule slash@3.0.0 checking installable status 96 silly pacote range manifest for recast@^0.18.1 fetched in 212ms 97 silly resolveWithNewModule recast@0.18.5 checking installable status 98 http fetch GET 304 https://registry.npmjs.org/vue-jscodeshift-adapter 205ms (from cache) 99 http fetch GET 304 https://registry.npmjs.org/yaml-front-matter 201ms (from cache) 100 silly pacote range manifest for vue-jscodeshift-adapter@^2.0.2 fetched in 208ms 101 silly resolveWithNewModule vue-jscodeshift-adapter@2.0.3 checking installable status 102 silly pacote range manifest for yaml-front-matter@^3.4.1 fetched in 204ms 103 silly resolveWithNewModule yaml-front-matter@3.4.1 checking installable status 104 http fetch GET 304 https://registry.npmjs.org/validate-npm-package-name 210ms (from cache) 105 http fetch GET 304 https://registry.npmjs.org/resolve 213ms (from cache) 106 silly pacote range manifest for validate-npm-package-name@^3.0.0 fetched in 212ms 107 silly resolveWithNewModule validate-npm-package-name@3.0.0 checking installable status 108 silly pacote range manifest for resolve@^1.15.0 fetched in 216ms 109 silly resolveWithNewModule resolve@1.15.1 checking installable status 110 http fetch GET 304 https://registry.npmjs.org/execa 201ms (from cache) 111 silly pacote range manifest for execa@^1.0.0 fetched in 206ms 112 silly resolveWithNewModule execa@1.0.0 checking installable status 113 http fetch GET 304 https://registry.npmjs.org/node-ipc 211ms (from cache) 114 http fetch GET 304 https://registry.npmjs.org/launch-editor 212ms (from cache) 115 http fetch GET 304 https://registry.npmjs.org/ora 211ms (from cache) 116 http fetch GET 304 https://registry.npmjs.org/request-promise-native 211ms (from cache) 117 http fetch GET 304 https://registry.npmjs.org/chalk 214ms (from cache) 118 http fetch GET 304 https://registry.npmjs.org/read-pkg 215ms (from cache) 119 http fetch GET 304 https://registry.npmjs.org/request 216ms (from cache) 120 silly pacote range manifest for node-ipc@^9.1.1 fetched in 219ms 121 silly resolveWithNewModule node-ipc@9.1.1 checking installable status 122 silly pacote range manifest for launch-editor@^2.2.1 fetched in 220ms 123 silly resolveWithNewModule launch-editor@2.2.1 checking installable status 124 silly pacote range manifest for ora@^3.4.0 fetched in 220ms 125 silly resolveWithNewModule ora@3.4.0 checking installable status 126 silly pacote range manifest for chalk@^2.4.2 fetched in 222ms 127 silly resolveWithNewModule chalk@2.4.2 checking installable status 128 silly pacote range manifest for request-promise-native@^1.0.8 fetched in 221ms 129 silly resolveWithNewModule request-promise-native@1.0.8 checking installable status 130 silly pacote range manifest for read-pkg@^5.1.1 fetched in 223ms 131 silly resolveWithNewModule read-pkg@5.2.0 checking installable status 132 http fetch GET 304 https://registry.npmjs.org/open 225ms (from cache) 133 http fetch GET 304 https://registry.npmjs.org/@hapi%2fjoi 227ms (from cache) 134 silly pacote range manifest for request@^2.87.0 fetched in 226ms 135 warn deprecated request@2.88.2: request has been deprecated, see request/request#3142 136 silly resolveWithNewModule request@2.88.2 checking installable status 137 silly pacote range manifest for open@^6.3.0 fetched in 229ms 138 silly resolveWithNewModule open@6.4.0 checking installable status 139 silly pacote range manifest for @hapi/joi@^15.0.1 fetched in 231ms 140 silly resolveWithNewModule @hapi/joi@15.1.1 checking installable status 141 http fetch GET 304 https://registry.npmjs.org/semver 176ms (from cache) 142 silly pacote range manifest for semver@^6.1.0 fetched in 178ms 143 silly resolveWithNewModule semver@6.3.0 checking installable status 144 http fetch GET 304 https://registry.npmjs.org/strip-ansi 184ms (from cache) 145 silly pacote range manifest for strip-ansi@^6.0.0 fetched in 184ms 146 silly resolveWithNewModule strip-ansi@6.0.0 checking installable status 147 http fetch GET 304 https://registry.npmjs.org/@hapi%2fhoek 191ms (from cache) 148 http fetch GET 304 https://registry.npmjs.org/@hapi%2ftopo 192ms (from cache) 149 silly pacote range manifest for @hapi/hoek@8.x.x fetched in 193ms 150 silly resolveWithNewModule @hapi/hoek@8.5.1 checking installable status 151 silly pacote range manifest for @hapi/topo@3.x.x fetched in 194ms 152 silly resolveWithNewModule @hapi/topo@3.1.6 checking installable status 153 http fetch GET 304 https://registry.npmjs.org/@hapi%2faddress 196ms (from cache) 154 http fetch GET 304 https://registry.npmjs.org/@hapi%2fbourne 197ms (from cache) 155 silly pacote range manifest for @hapi/address@2.x.x fetched in 197ms 156 silly resolveWithNewModule @hapi/address@2.1.4 checking installable status 157 silly pacote range manifest for @hapi/bourne@1.x.x fetched in 198ms 158 silly resolveWithNewModule @hapi/bourne@1.3.2 checking installable status 159 http fetch GET 304 https://registry.npmjs.org/supports-color 198ms (from cache) 160 http fetch GET 304 https://registry.npmjs.org/ansi-styles 200ms (from cache) 161 silly pacote range manifest for supports-color@^5.3.0 fetched in 200ms 162 silly resolveWithNewModule supports-color@5.5.0 checking installable status 163 silly pacote range manifest for ansi-styles@^3.2.1 fetched in 201ms 164 silly resolveWithNewModule ansi-styles@3.2.1 checking installable status 165 http fetch GET 304 https://registry.npmjs.org/escape-string-regexp 213ms (from cache) 166 silly pacote range manifest for escape-string-regexp@^1.0.5 fetched in 213ms 167 silly resolveWithNewModule escape-string-regexp@1.0.5 checking installable status 168 http fetch GET 304 https://registry.npmjs.org/color-convert 173ms (from cache) 169 silly pacote range manifest for color-convert@^1.9.0 fetched in 174ms 170 silly resolveWithNewModule color-convert@1.9.3 checking installable status 171 http fetch GET 304 https://registry.npmjs.org/color-name 179ms (from cache) 172 silly pacote version manifest for color-name@1.1.3 fetched in 180ms 173 silly resolveWithNewModule color-name@1.1.3 checking installable status 174 http fetch GET 304 https://registry.npmjs.org/has-flag 178ms (from cache) 175 silly pacote range manifest for has-flag@^3.0.0 fetched in 179ms 176 silly resolveWithNewModule has-flag@3.0.0 checking installable status 177 http fetch GET 200 https://registry.npmjs.org/get-stream 10ms (from cache) 178 silly pacote range manifest for get-stream@^4.0.0 fetched in 10ms 179 silly resolveWithNewModule get-stream@4.1.0 checking installable status 180 http fetch GET 304 https://registry.npmjs.org/is-stream 205ms (from cache) 181 http fetch GET 304 https://registry.npmjs.org/strip-eof 205ms (from cache) 182 silly pacote range manifest for is-stream@^1.1.0 fetched in 208ms 183 silly resolveWithNewModule is-stream@1.1.0 checking installable status 184 silly pacote range manifest for strip-eof@^1.0.0 fetched in 207ms 185 silly resolveWithNewModule strip-eof@1.0.0 checking installable status 186 http fetch GET 304 https://registry.npmjs.org/npm-run-path 211ms (from cache) 187 http fetch GET 304 https://registry.npmjs.org/signal-exit 211ms (from cache) 188 silly pacote range manifest for npm-run-path@^2.0.0 fetched in 213ms 189 silly resolveWithNewModule npm-run-path@2.0.2 checking installable status 190 http fetch GET 304 https://registry.npmjs.org/p-finally 212ms (from cache) 191 silly pacote range manifest for signal-exit@^3.0.0 fetched in 213ms 192 silly resolveWithNewModule signal-exit@3.0.2 checking installable status 193 silly pacote range manifest for p-finally@^1.0.0 fetched in 214ms 194 silly resolveWithNewModule p-finally@1.0.0 checking installable status 195 http fetch GET 304 https://registry.npmjs.org/cross-spawn 216ms (from cache) 196 silly pacote range manifest for cross-spawn@^6.0.0 fetched in 219ms 197 silly resolveWithNewModule cross-spawn@6.0.5 checking installable status 198 silly pacote range manifest for semver@^5.5.0 fetched in 4ms 199 silly resolveWithNewModule semver@5.7.1 checking installable status 200 http fetch GET 304 https://registry.npmjs.org/shebang-command 195ms (from cache) 201 http fetch GET 304 https://registry.npmjs.org/path-key 195ms (from cache) 202 http fetch GET 304 https://registry.npmjs.org/nice-try 196ms (from cache) 203 http fetch GET 304 https://registry.npmjs.org/which 197ms (from cache) 204 silly pacote range manifest for shebang-command@^1.2.0 fetched in 197ms 205 silly resolveWithNewModule shebang-command@1.2.0 checking installable status 206 silly pacote range manifest for path-key@^2.0.1 fetched in 198ms 207 silly resolveWithNewModule path-key@2.0.1 checking installable status 208 silly pacote range manifest for nice-try@^1.0.4 fetched in 199ms 209 silly resolveWithNewModule nice-try@1.0.5 checking installable status 210 silly pacote range manifest for which@^1.2.9 fetched in 199ms 211 silly resolveWithNewModule which@1.3.1 checking installable status 212 http fetch GET 304 https://registry.npmjs.org/shebang-regex 175ms (from cache) 213 silly pacote range manifest for shebang-regex@^1.0.0 fetched in 176ms 214 silly resolveWithNewModule shebang-regex@1.0.0 checking installable status 215 http fetch GET 304 https://registry.npmjs.org/isexe 188ms (from cache) 216 silly pacote range manifest for isexe@^2.0.0 fetched in 188ms 217 silly resolveWithNewModule isexe@2.0.0 checking installable status 218 http fetch GET 304 https://registry.npmjs.org/pump 167ms (from cache) 219 silly pacote range manifest for pump@^3.0.0 fetched in 168ms 220 silly resolveWithNewModule pump@3.0.0 checking installable status 221 http fetch GET 304 https://registry.npmjs.org/once 171ms (from cache) 222 silly pacote range manifest for once@^1.3.1 fetched in 172ms 223 silly resolveWithNewModule once@1.4.0 checking installable status 224 http fetch GET 304 https://registry.npmjs.org/end-of-stream 176ms (from cache) 225 silly pacote range manifest for end-of-stream@^1.1.0 fetched in 176ms 226 silly resolveWithNewModule end-of-stream@1.4.4 checking installable status 227 http fetch GET 304 https://registry.npmjs.org/wrappy 178ms (from cache) 228 silly pacote range manifest for wrappy@1 fetched in 179ms 229 silly resolveWithNewModule wrappy@1.0.2 checking installable status 230 http fetch GET 304 https://registry.npmjs.org/shell-quote 215ms (from cache) 231 silly pacote range manifest for shell-quote@^1.6.1 fetched in 216ms 232 silly resolveWithNewModule shell-quote@1.7.2 checking installable status 233 http fetch GET 200 https://registry.npmjs.org/yallist 2ms (from cache) 234 silly pacote range manifest for yallist@^3.0.2 fetched in 3ms 235 silly resolveWithNewModule yallist@3.1.1 checking installable status 236 http fetch GET 304 https://registry.npmjs.org/js-message 253ms (from cache) 237 http fetch GET 304 https://registry.npmjs.org/js-queue 253ms (from cache) 238 http fetch GET 304 https://registry.npmjs.org/event-pubsub 254ms (from cache) 239 silly pacote version manifest for js-message@1.0.5 fetched in 254ms 240 silly resolveWithNewModule js-message@1.0.5 checking installable status 241 silly pacote version manifest for js-queue@2.0.0 fetched in 255ms 242 silly resolveWithNewModule js-queue@2.0.0 checking installable status 243 silly pacote version manifest for event-pubsub@4.3.0 fetched in 255ms 244 silly resolveWithNewModule event-pubsub@4.3.0 checking installable status 245 http fetch GET 304 https://registry.npmjs.org/easy-stack 204ms (from cache) 246 silly pacote range manifest for easy-stack@^1.0.0 fetched in 204ms 247 silly resolveWithNewModule easy-stack@1.0.0 checking installable status 248 http fetch GET 304 https://registry.npmjs.org/is-wsl 204ms (from cache) 249 silly pacote range manifest for is-wsl@^1.1.0 fetched in 205ms 250 silly resolveWithNewModule is-wsl@1.1.0 checking installable status 251 silly pacote range manifest for strip-ansi@^5.2.0 fetched in 2ms 252 silly resolveWithNewModule strip-ansi@5.2.0 checking installable status 253 http fetch GET 304 https://registry.npmjs.org/cli-spinners 189ms (from cache) 254 http fetch GET 304 https://registry.npmjs.org/cli-cursor 190ms (from cache) 255 silly pacote range manifest for cli-spinners@^2.0.0 fetched in 191ms 256 silly resolveWithNewModule cli-spinners@2.2.0 checking installable status 257 silly pacote range manifest for cli-cursor@^2.1.0 fetched in 192ms 258 silly resolveWithNewModule cli-cursor@2.1.0 checking installable status 259 http fetch GET 304 https://registry.npmjs.org/wcwidth 193ms (from cache) 260 silly pacote range manifest for wcwidth@^1.0.1 fetched in 194ms 261 silly resolveWithNewModule wcwidth@1.0.1 checking installable status 262 http fetch GET 304 https://registry.npmjs.org/log-symbols 200ms (from cache) 263 silly pacote range manifest for log-symbols@^2.2.0 fetched in 201ms 264 silly resolveWithNewModule log-symbols@2.2.0 checking installable status 265 http fetch GET 304 https://registry.npmjs.org/restore-cursor 181ms (from cache) 266 silly pacote range manifest for restore-cursor@^2.0.0 fetched in 183ms 267 silly resolveWithNewModule restore-cursor@2.0.0 checking installable status 268 http fetch GET 304 https://registry.npmjs.org/onetime 171ms (from cache) 269 silly pacote range manifest for onetime@^2.0.0 fetched in 172ms 270 silly resolveWithNewModule onetime@2.0.1 checking installable status 271 http fetch GET 304 https://registry.npmjs.org/mimic-fn 180ms (from cache) 272 silly pacote range manifest for mimic-fn@^1.0.0 fetched in 180ms 273 silly resolveWithNewModule mimic-fn@1.2.0 checking installable status 274 http fetch GET 304 https://registry.npmjs.org/ansi-regex 191ms (from cache) 275 silly pacote range manifest for ansi-regex@^4.1.0 fetched in 191ms 276 silly resolveWithNewModule ansi-regex@4.1.0 checking installable status 277 http fetch GET 304 https://registry.npmjs.org/defaults 176ms (from cache) 278 silly pacote range manifest for defaults@^1.0.3 fetched in 177ms 279 silly resolveWithNewModule defaults@1.0.3 checking installable status 280 http fetch GET 304 https://registry.npmjs.org/clone 186ms (from cache) 281 silly pacote range manifest for clone@^1.0.2 fetched in 187ms 282 silly resolveWithNewModule clone@1.0.4 checking installable status 283 http fetch GET 304 https://registry.npmjs.org/parse-json 185ms (from cache) 284 http fetch GET 304 https://registry.npmjs.org/@types%2fnormalize-package-data 188ms (from cache) 285 http fetch GET 304 https://registry.npmjs.org/type-fest 186ms (from cache) 286 silly pacote range manifest for parse-json@^5.0.0 fetched in 187ms 287 silly resolveWithNewModule parse-json@5.0.0 checking installable status 288 silly pacote range manifest for @types/normalize-package-data@^2.4.0 fetched in 189ms 289 silly resolveWithNewModule @types/normalize-package-data@2.4.0 checking installable status 290 silly pacote range manifest for type-fest@^0.6.0 fetched in 189ms 291 silly resolveWithNewModule type-fest@0.6.0 checking installable status 292 http fetch GET 304 https://registry.npmjs.org/normalize-package-data 200ms (from cache) 293 silly pacote range manifest for normalize-package-data@^2.5.0 fetched in 202ms 294 silly resolveWithNewModule normalize-package-data@2.5.0 checking installable status 295 silly pacote range manifest for semver@2 || 3 || 4 || 5 fetched in 4ms 296 silly resolveWithNewModule semver@5.7.1 checking installable status 297 http fetch GET 304 https://registry.npmjs.org/hosted-git-info 168ms (from cache) 298 silly pacote range manifest for hosted-git-info@^2.1.4 fetched in 169ms 299 silly resolveWithNewModule hosted-git-info@2.8.5 checking installable status 300 http fetch GET 304 https://registry.npmjs.org/validate-npm-package-license 173ms (from cache) 301 silly pacote range manifest for validate-npm-package-license@^3.0.1 fetched in 173ms 302 silly resolveWithNewModule validate-npm-package-license@3.0.4 checking installable status 303 http fetch GET 304 https://registry.npmjs.org/path-parse 183ms (from cache) 304 silly pacote range manifest for path-parse@^1.0.6 fetched in 183ms 305 silly resolveWithNewModule path-parse@1.0.6 checking installable status 306 http fetch GET 304 https://registry.npmjs.org/spdx-expression-parse 175ms (from cache) 307 http fetch GET 304 https://registry.npmjs.org/spdx-correct 175ms (from cache) 308 silly pacote range manifest for spdx-expression-parse@^3.0.0 fetched in 176ms 309 silly resolveWithNewModule spdx-expression-parse@3.0.0 checking installable status 310 silly pacote range manifest for spdx-correct@^3.0.0 fetched in 177ms 311 silly resolveWithNewModule spdx-correct@3.1.0 checking installable status 312 http fetch GET 304 https://registry.npmjs.org/spdx-license-ids 175ms (from cache) 313 silly pacote range manifest for spdx-license-ids@^3.0.0 fetched in 176ms 314 silly resolveWithNewModule spdx-license-ids@3.0.5 checking installable status 315 http fetch GET 304 https://registry.npmjs.org/spdx-exceptions 172ms (from cache) 316 silly pacote range manifest for spdx-exceptions@^2.1.0 fetched in 173ms 317 silly resolveWithNewModule spdx-exceptions@2.2.0 checking installable status 318 http fetch GET 404 https://registry.npmjs.org/error-ex 166ms 319 http fetch GET 304 https://registry.npmjs.org/json-parse-better-errors 190ms (from cache) 320 silly pacote range manifest for json-parse-better-errors@^1.0.1 fetched in 191ms 321 silly resolveWithNewModule json-parse-better-errors@1.0.2 checking installable status 322 http fetch GET 304 https://registry.npmjs.org/lines-and-columns 192ms (from cache) 323 silly pacote range manifest for lines-and-columns@^1.1.6 fetched in 193ms 324 silly resolveWithNewModule lines-and-columns@1.1.6 checking installable status 325 http fetch GET 304 https://registry.npmjs.org/@babel%2fcode-frame 203ms (from cache) 326 silly pacote range manifest for @babel/code-frame@^7.0.0 fetched in 203ms 327 silly resolveWithNewModule @babel/code-frame@7.8.3 checking installable status 328 http fetch GET 404 https://registry.npmjs.org/error-ex 153ms 329 silly fetchPackageMetaData error for error-ex@^1.3.1 404 Not Found - GET https://registry.npmjs.org/error-ex 330 timing stage:rollbackFailedOptional Completed in 0ms 331 timing stage:runTopLevelLifecycles Completed in 8161ms 332 silly saveTree Sellist 332 silly saveTree └─┬ @vue/cli@4.2.2 332 silly saveTree ├─┬ @vue/cli-shared-utils@4.2.2 332 silly saveTree │ ├─┬ @hapi/joi@15.1.1 332 silly saveTree │ │ ├── @hapi/address@2.1.4 332 silly saveTree │ │ ├── @hapi/bourne@1.3.2 332 silly saveTree │ │ ├── @hapi/hoek@8.5.1 332 silly saveTree │ │ └── @hapi/topo@3.1.6 332 silly saveTree │ ├─┬ chalk@2.4.2 332 silly saveTree │ │ ├─┬ ansi-styles@3.2.1 332 silly saveTree │ │ │ └─┬ color-convert@1.9.3 332 silly saveTree │ │ │ └── color-name@1.1.3 332 silly saveTree │ │ ├── escape-string-regexp@1.0.5 332 silly saveTree │ │ └─┬ supports-color@5.5.0 332 silly saveTree │ │ └── has-flag@3.0.0 332 silly saveTree │ ├─┬ execa@1.0.0 332 silly saveTree │ │ ├─┬ cross-spawn@6.0.5 332 silly saveTree │ │ │ ├── nice-try@1.0.5 332 silly saveTree │ │ │ ├── path-key@2.0.1 332 silly saveTree │ │ │ ├── semver@5.7.1 332 silly saveTree │ │ │ ├─┬ shebang-command@1.2.0 332 silly saveTree │ │ │ │ └── shebang-regex@1.0.0 332 silly saveTree │ │ │ └─┬ which@1.3.1 332 silly saveTree │ │ │ └── isexe@2.0.0 332 silly saveTree │ │ ├─┬ get-stream@4.1.0 332 silly saveTree │ │ │ └─┬ pump@3.0.0 332 silly saveTree │ │ │ ├─┬ end-of-stream@1.4.4 332 silly saveTree │ │ │ │ └─┬ once@1.4.0 332 silly saveTree │ │ │ │ └── wrappy@1.0.2 332 silly saveTree │ │ │ └── once@1.4.0 332 silly saveTree │ │ ├── is-stream@1.1.0 332 silly saveTree │ │ ├── npm-run-path@2.0.2 332 silly saveTree │ │ ├── p-finally@1.0.0 332 silly saveTree │ │ ├── signal-exit@3.0.2 332 silly saveTree │ │ └── strip-eof@1.0.0 332 silly saveTree │ ├─┬ launch-editor@2.2.1 332 silly saveTree │ │ └── shell-quote@1.7.2 332 silly saveTree │ ├─┬ lru-cache@5.1.1 332 silly saveTree │ │ └── yallist@3.1.1 332 silly saveTree │ ├─┬ node-ipc@9.1.1 332 silly saveTree │ │ ├── event-pubsub@4.3.0 332 silly saveTree │ │ ├── js-message@1.0.5 332 silly saveTree │ │ └─┬ js-queue@2.0.0 332 silly saveTree │ │ └── easy-stack@1.0.0 332 silly saveTree │ ├─┬ open@6.4.0 332 silly saveTree │ │ └── is-wsl@1.1.0 332 silly saveTree │ ├─┬ ora@3.4.0 332 silly saveTree │ │ ├─┬ cli-cursor@2.1.0 332 silly saveTree │ │ │ └─┬ restore-cursor@2.0.0 332 silly saveTree │ │ │ └─┬ onetime@2.0.1 332 silly saveTree │ │ │ └── mimic-fn@1.2.0 332 silly saveTree │ │ ├── cli-spinners@2.2.0 332 silly saveTree │ │ ├── log-symbols@2.2.0 332 silly saveTree │ │ ├─┬ strip-ansi@5.2.0 332 silly saveTree │ │ │ └── ansi-regex@4.1.0 332 silly saveTree │ │ └─┬ wcwidth@1.0.1 332 silly saveTree │ │ └─┬ defaults@1.0.3 332 silly saveTree │ │ └── clone@1.0.4 332 silly saveTree │ ├─┬ read-pkg@5.2.0 332 silly saveTree │ │ ├── @types/normalize-package-data@2.4.0 332 silly saveTree │ │ ├─┬ normalize-package-data@2.5.0 332 silly saveTree │ │ │ ├── hosted-git-info@2.8.5 332 silly saveTree │ │ │ ├─┬ resolve@1.15.1 332 silly saveTree │ │ │ │ └── path-parse@1.0.6 332 silly saveTree │ │ │ ├── semver@5.7.1 332 silly saveTree │ │ │ └─┬ validate-npm-package-license@3.0.4 332 silly saveTree │ │ │ ├─┬ spdx-correct@3.1.0 332 silly saveTree │ │ │ │ ├─┬ spdx-expression-parse@3.0.0 332 silly saveTree │ │ │ │ │ ├── spdx-exceptions@2.2.0 332 silly saveTree │ │ │ │ │ └── spdx-license-ids@3.0.5 332 silly saveTree │ │ │ │ └── spdx-license-ids@3.0.5 332 silly saveTree │ │ │ └── spdx-expression-parse@3.0.0 332 silly saveTree │ │ ├─┬ parse-json@5.0.0 332 silly saveTree │ │ │ ├── @babel/code-frame@7.8.3 332 silly saveTree │ │ │ ├── json-parse-better-errors@1.0.2 332 silly saveTree │ │ │ └── lines-and-columns@1.1.6 332 silly saveTree │ │ └── type-fest@0.6.0 332 silly saveTree │ ├── request-promise-native@1.0.8 332 silly saveTree │ ├── request@2.88.2 332 silly saveTree │ ├── semver@6.3.0 332 silly saveTree │ └── strip-ansi@6.0.0 332 silly saveTree ├── @vue/cli-ui-addon-webpack@4.2.2 332 silly saveTree ├── @vue/cli-ui-addon-widgets@4.2.2 332 silly saveTree ├─┬ @vue/cli-ui@4.2.2 332 silly saveTree │ ├── deepmerge@4.2.2 332 silly saveTree │ ├── fs-extra@7.0.1 332 silly saveTree │ ├── globby@9.2.0 332 silly saveTree │ ├── javascript-stringify@1.6.0 332 silly saveTree │ ├── js-yaml@3.13.1 332 silly saveTree │ └── shortid@2.2.15 332 silly saveTree ├── boxen@4.2.0 332 silly saveTree ├── cmd-shim@3.0.3 332 silly saveTree ├── commander@2.20.3 332 silly saveTree ├── debug@4.1.1 332 silly saveTree ├── deepmerge@4.2.2 332 silly saveTree ├── didyoumean@1.2.1 332 silly saveTree ├── download-git-repo@1.1.0 332 silly saveTree ├── ejs@2.7.4 332 silly saveTree ├── envinfo@7.5.0 332 silly saveTree ├── fs-extra@7.0.1 332 silly saveTree ├── globby@9.2.0 332 silly saveTree ├── import-global@0.1.0 332 silly saveTree ├── inquirer@6.5.2 332 silly saveTree ├── isbinaryfile@4.0.4 332 silly saveTree ├── javascript-stringify@1.6.0 332 silly saveTree ├── js-yaml@3.13.1 332 silly saveTree ├─┬ jscodeshift@0.7.0 332 silly saveTree │ └── recast@0.18.5 332 silly saveTree ├── lodash.clonedeep@4.5.0 332 silly saveTree ├── lru-cache@5.1.1 332 silly saveTree ├── minimist@1.2.0 332 silly saveTree ├── recast@0.18.5 332 silly saveTree ├── resolve@1.15.1 332 silly saveTree ├── shortid@2.2.15 332 silly saveTree ├── slash@3.0.0 332 silly saveTree ├── validate-npm-package-name@3.0.0 332 silly saveTree ├── vue-jscodeshift-adapter@2.0.3 332 silly saveTree └── yaml-front-matter@3.4.1 333 verbose stack Error: 404 Not Found - GET https://registry.npmjs.org/error-ex 333 verbose stack at /usr/local/lib/node_modules/npm/node_modules/npm-registry-fetch/check-response.js:104:15 333 verbose stack at processTicksAndRejections (internal/process/task_queues.js:94:5) 334 verbose statusCode 404 335 verbose pkgid error-ex@^1.3.1 336 verbose cwd /Users/sellist/Projects/Sellist 337 verbose Darwin 18.7.0 338 verbose argv "/usr/local/Cellar/node@12/12.15.0/bin/node" "/usr/local/bin/npm" "install" "@vue/cli" 339 verbose node v12.15.0 340 verbose npm v6.13.7 341 error code E404 342 error 404 Not Found - GET https://registry.npmjs.org/error-ex 343 error 404 344 error 404 'error-ex@^1.3.1' is not in the npm registry. 345 error 404 You should bug the author to publish it (or use the name yourself!) 346 error 404 It was specified as a dependency of 'parse-json' 347 error 404 Note that you can also install from a 348 error 404 tarball, folder, http url, or git url. 349 verbose exit [ 1, true ]

closed time in 7 days

awmed

issue commentvuejs/vue

Unable to install vue cli

Hi, thanks for your interest but Github issues are for bug reports and feature requests only. You can ask questions on the forum, the Discord server or StackOverflow.

awmed

comment created time in 7 days

pull request commentnuxt/nuxt.js

fix(vue-app): set scrollRestoration when there is no location hash

I agree with @clarkdo. Also, not setting the scrollRestoration to manual only because there is a hash would break the scroll for applications using the fragment section of the url to store some information as well as other cases with an empty hash # to avoid some urls like the ones ending with . not being completely considered as URLs in many applications (like Discord)

This might be a bit difficult to add to current vue router, although still possible. It should be quite easy with the next version

casey6

comment created time in 7 days

issue closedvuejs/composition-api

Unwrap ref from function in template

I'm not sure is it issue or not, but it's really annoying behavior. I have function(fn) which return ref, but this ref will not unwrapped in template:

Screenshot from 2020-02-11 17-37-24

I want to have similar result as for fn2 link to codepen: https://codepen.io/utlime/pen/gOppBGj

closed time in 7 days

utlime

issue commentvuejs/composition-api

Unwrap ref from function in template

Doing an implicit conversion here could lead to unexpected behaviors and also being unable to pass the ref itself to another function.

The only properties that do not require the .value in template are the ones returned in the setup function

utlime

comment created time in 7 days

issue closedvuejs/composition-api

How to replace reactive object

const info = reactive(
 {
   name: 'a'
 }
)


// It does not work(lose reactive) ,  info : {name:'a'}  => info : {name:'b'}
info = reactive(
 {
   name: 'b'
 }
)

closed time in 8 days

xmsz

issue commentvuejs/composition-api

How to replace reactive object

Use a ref instead of you want to change it’s value via info.value

xmsz

comment created time in 8 days

push eventvuejs/vuefire

Sarah Dayan

commit sha 85be8f8c41ac1c7fcd57a0b2d43ada7a14f179b1

docs: add new VueFire logo (#589) * feat: add new VueFire logo * fix: fix alt text * chore: update logo with latest version Closes #158

view details

push time in 8 days

PR merged vuejs/vuefire

feat: add new VueFire logo

This adds the new logo by @geneparcellano to the repository and documentation.

Before

Capture d’écran 2020-02-06 à 17 50 38

After

Capture d’écran 2020-02-06 à 17 50 55

fix #158

+3 -54

15 comments

4 changed files

sarahdayan

pr closed time in 8 days

issue closedvuejs/vuefire

Logo suggestion

I came across this logo made by the owner of this repo: https://github.com/sejr/vuefire-quickstart He gave his permission to use it as a logo for VueFire: https://github.com/sejr/vuefire-quickstart/issues/1

What do you think? 😎

closed time in 8 days

mornir

pull request commentvuejs/vuefire

feat: add new VueFire logo

Thanks to both of you! I wish it had rounder corners and some a bit of depth (like the Firebase one) without necessarily keeping Vue's color but it's still good and gives the project some identity :)

sarahdayan

comment created time in 8 days

issue closedvuejs/vue

Can a "custom event modifier" be provided for "vue plugin developer "?

What problem does this feature solve?

For example, touch events actually have multiple targets in ev.touches, while vue's existing "event modifiers" are mostly for ev.target. Could you provide a more elegant opportunity for vue's plug-in developers to "customize event modifiers"?

I am developing a gesture library for basic touch events, simulating multi-pinch requires determining whether each target in touches is a child element of currentTarget, which is not very elegant now, but I like vue very much, I hope my plugin can make people use it more elegant in vue, I hope you can get help. Thanks. now:

     <div
                @pinch="$event.xx() && onPinch"
                @rotate="$event.xx() && onRotate"
            >

What does the proposed API look like?

     <div
                @pinch.xx="onPinch"
                @rotate.xx="onRotate"
            >

or:

     <div
                @pinch.from:xx="onPinch"
                @rotate.from.xx="onRotate"
            >

<!-- generated by vue-issues. DO NOT REMOVE -->

closed time in 8 days

any86

issue commentvuejs/vue

Can a "custom event modifier" be provided for "vue plugin developer "?

This could be interesting but needs to go through the RFC process (https://github.com/vuejs/rfcs#vue-rfcs) to provide much clearer details like is it at runtime or at compilation time? And clearer examples about its usage, benefits, and drawbacks.

any86

comment created time in 8 days

issue closedvuejs/vue-router

Transpile/expose utils for importing into project

What problem does this feature solve?

This let's devs rely on one source of truth for using the same utilities as vue-router when building similar functionality into our own projects.

Mainly, this came up when looking for a way to import the stringifyQuery function from vue-router/src/util/query.js. Then realizing that it would need to be transpiled from TS etc. for it to be able to be imported. This was so that I could build a URL with parameters to be sent to an API.

I have not researched further than this, but maybe there are more functions that could benefit devs by exposing them more easily?

What does the proposed API look like?

import { stringifyQuery } from 'vue-router';
...
const encodedQueries = stringifyQuery(query);

<!-- generated by vue-issues. DO NOT REMOVE -->

closed time in 8 days

Knogobert

issue commentvuejs/vue-router

Transpile/expose utils for importing into project

Those utilities are used internally but we don't want to expose them because they could change in the future. So for the moment, with vue router 3, this is not going to happen. Things might change in vue router 4.

That being said, you don't really need those utilities, there are plenty of libraries that do that stringification. You even have a native URLSearchParams

Knogobert

comment created time in 8 days

issue commentvuejs/vue-router

Upgrading to TypeScript 3.7 yields vue-router type error with composition-api

It may be that the problem is at https://github.com/vuejs/composition-api/issues/185 too, ending up in no contribution here

aaf-ww

comment created time in 8 days

issue closedvuejs/vue

Vue drops elements from markup when using template elements

Version

2.6.11

Reproduction link

https://codepen.io/ksefchik/pen/xxGGRXq

Steps to reproduce

  1. Create two components and link their templates by using template element in HTML as template in script definition.
  2. Create a third parent component and link it's template using template element in HTML as template in script definition.
  3. Place the two components into the third parent component as siblings.

What is expected?

Sibling components are both displayed.

What is actually happening?

Only first sibling is displayed.

<!-- generated by vue-issues. DO NOT REMOVE -->

closed time in 8 days

deathgaze

issue commentvuejs/vue

Vue drops elements from markup when using template elements

When reporting a bug please provide a boiled down repro with no external dependencies (no vuex, no materialize) with clear instructions on what to do on the demo to see the bug. Ping me or open a new issue once you have one

deathgaze

comment created time in 8 days

startedposva/jest-mock-warn

started time in 9 days

pull request commentvuejs/vuefire

feat: add new VueFire logo

I do like the one with a bigger flame more :)

sarahdayan

comment created time in 10 days

issue closedvuejs/vue

Dev build console error when using index in :key value with v-for and transitions

What problem does this feature solve?

Currently there is no obvious way to debug an error when including the index value in v-bind:key with v-for when using transitions. This causes erratic and unexpected behavior from transitions (and I would suspect other side effects, but these are untested).

This feature would alert the developer that they have used index value in a place where it will cause errors with transitions.

Example error:

This example should illustrate how difficult it is to determine why the v-for combined with transition-group fails.

In the example below there are 3 uses of v-for with :key. (1) one works fine, it doesn't include index in the :key value. (2) uses index as the key (ie, v-bind:key="index"). (3) uses a concatenated version (v-bind:key="item '_' index"

https://codepen.io/megacromulent/pen/gdMYLx?editors=1010

Note: this behavior was thought to be a bug because of lack of documentation on this behavior ( #8718 ) and having a console log entry would have solved the confusion instantly during development, instead of hours of debugging and reporting.

What does the proposed API look like?

Check to see if the index value is used anywhere in :key, and then check if a transition is being used, if so, then display console error, or at least a warning.

The proposal is for the dev builds only, so no additions/expansions to the API are needed for the production builds.

<!-- generated by vue-issues. DO NOT REMOVE -->

closed time in 10 days

megacromulent

issue commentvuejs/vue

Dev build console error when using index in :key value with v-for and transitions

It wasn't correctly reference I the commit message of the PR https://github.com/vuejs/vue/pull/8748

megacromulent

comment created time in 10 days

issue closedvuejs/composition-api

What is the lifespan and scope of a provided/injected value using the composition API?

Greetings,

By lifespan, I mean when will the provided value be garbage collected, if ever? Is it tied to the lifespan of the component provider that called provide in first time? Or also tied to the injecting components?

By scope, I mean where can I inject the provided value? Anywhere in the app or only in the children components of the parent component provider? Or also can be injected inside sibling and grandparent components?

Thank you.

closed time in 11 days

geekox86

issue commentvuejs/composition-api

What is the lifespan and scope of a provided/injected value using the composition API?

Provided values are accessible only to descendant and can be garbage collected once the component providing the variable is released itself

geekox86

comment created time in 11 days

PR closed vuejs/vue

fix: do not warn on valid `delete`

<!-- Please make sure to read the Pull Request Guidelines: https://github.com/vuejs/vue/blob/dev/.github/CONTRIBUTING.md#pull-request-guidelines -->

<!-- PULL REQUEST TEMPLATE --> <!-- (Update "[ ]" to "[x]" to check a box) -->

What kind of change does this PR introduce? (check at least one)

  • [x] Bugfix
  • [ ] Feature
  • [ ] Code style update
  • [ ] Refactor
  • [ ] Build-related changes
  • [ ] Other, please describe:

Does this PR introduce a breaking change? (check one)

  • [ ] Yes
  • [x] No

If yes, please describe the impact and migration path for existing applications:

The PR fulfills these requirements:

  • [x] It's submitted to the dev branch for v2.x (or to a previous version branch), not the master branch
  • [x] When resolving a specific issue, it's referenced in the PR's title (e.g. fix #xxx[,#xxx], where "xxx" is the issue number)
  • [ ] All tests are passing: https://github.com/vuejs/vue/blob/dev/.github/CONTRIBUTING.md#development-setup
  • [ ] New/updated tests are included

If adding a new feature, the PR's description includes:

  • [ ] A convincing reason for adding this feature (to avoid wasting your time, it's best to open a suggestion issue first and wait for approval before working on it)

Other information: Fixes an issue where a warning was raised when objects had unary operators as property name

+1 -1

2 comments

1 changed file

simwipado

pr closed time in 11 days

pull request commentvuejs/vue

fix: do not warn on valid `delete`

Thanks but this regex won't work on all supported browsers and break on those. Regarding the PR, make sure to provide new test cases when adding or fixing features. Write fix #<number> in the message of the git commit and leave the title of the PR as the title of the commit (it makes more sense than a number)

simwipado

comment created time in 11 days

issue commentposva/pinia

Problem: How to handle dynamic store on runtime?

I was thinking of a regular array travelers where

travelers.push({
  id: someGeneratedId,
  name: '',
  age: ''
})

It doesn't really change v-model, you go through the array of travelers with a v-for:

<li v-for="traveler in travelers" :key="traveler.id"><input v-model="traveler.name"></li>

In vuex, the point of dynamic modules was adding store pieces by plugins and also lazily loading them. But on Pinia, due to its api, this is no longer a concern.

AhsanAbrar

comment created time in 11 days

issue closedvuejs/vue

Focusing on a recently visible element fails.

Version

2.6.10

Reproduction link

https://jsfiddle.net/bqurd5ts/1/

Steps to reproduce

  1. Click the "Appear then focus." button.
  2. Click the "Hide/Reset" button.
  3. Click the "Appear using set then focus" button.

What is expected?

Because assignment to a variable is intuitively synchronous, I expect that assigning a variable and then calling focus on an element to be able to focus on the element.

What is actually happening?

The element does not exist yet when calling focus after being rendered conditionally based on the data, so the focus needs to be called in a delayed function to wait for the element to appear.


If setting a variable results in a series of asynchronous events, then perhaps Vue.$set() should return a promise so that you know when it's rendered.

<!-- generated by vue-issues. DO NOT REMOVE -->

closed time in 11 days

adjenks

issue commentvuejs/vue

Focusing on a recently visible element fails.

This is expected: when the variable changes, the Dom is not immediately rendered. Wait for a vue tick:

this.vis = true
await this.$nextTick()
element.focus()

Remember you can use the forum or the Discord chat to ask quick questions!

adjenks

comment created time in 11 days

issue commentposva/pinia

Problem: How to handle dynamic store on runtime?

Thanks! Yeah, so I would use one single store and add a new entry for each traveler, probably in an array

AhsanAbrar

comment created time in 11 days

issue commentvuejs/vue-router

Passing Params as Props does not Work Well with Composition API

I don't have the example at hand but it think it was like this:

props: {
  id: {
    type: String
  } as PropType<string>
}
geekox86

comment created time in 11 days

pull request commentvuejs/vue-router

fix(TS): update type of Route.name

Thanks!

rijkvanzanten

comment created time in 11 days

push eventvuejs/vue-router

Rijk van Zanten

commit sha 8f831f28f33bb766d5baaabc8b2daff259f3d45b

fix(ts): add null to Route.name (#3117) * Update type of Route.name On very first load, `name` is `null`, not `string` or `undefined`. This means that either the passed route is wrong, or the type is incorrect. * fix(tests): fix type test

view details

push time in 11 days

PR merged vuejs/vue-router

fix(TS): update type of Route.name

On very first load, name is null, not string or undefined. This means that either the passed route is wrong, or the type is incorrect.

+3 -3

1 comment

2 changed files

rijkvanzanten

pr closed time in 11 days

issue commentvuejs/vue-router

Passing Params as Props does not Work Well with Composition API

You still have to declare the prop on the component: that line should not be commented. Regarding typing you should use PropType exported by @vue/composition-api


Please, next time consider using the forum, the Discord server or StackOverflow for questions first. But feel free to come back and open an issue if it turns out to be a bug 🙂

geekox86

comment created time in 11 days

more