Support for vuejs #22

Activity

1. ndelangen commented on Jan 23, 2018

   

   ndelangen

   on Jan 23, 2018

   Last edited by ndelangen

   Contributor

   More actions

   Thank you for your interest, right now there's no vue support I'm pretty sure. I haven't tested.

   Would be interested in hearing thoughts on how to support it.
   For now I've removed the project tag. sorry for the confusion.
2. davidm-public commented on Jan 24, 2018

   

   davidm-public

   on Jan 24, 2018

   More actions

   +1 for Vue support

   👍React with 👍5Reacted by Huseyn Guliyev, Wouter Kroes, Tawsif Ahmed, tttttahiti / Hisako Harada and Lazaro
3. husayt commented on Feb 16, 2018

   

   husayt

   on Feb 16, 2018

   Author

   More actions

   Actually, it should be doable, as vue also requires full definition of all component params.

   You can get more details here. But as you can see from the example below, props have types (Number, Boolean, String, Object, Array, Symbol, Function) defined and that information can be extracted to provide smart knob functionality.

   Vue.component('example', {
     props: {
       // basic type check (`null` means accept any type)
       propA: Number,
       // multiple possible types
       propB: [String, Number],
       // a required string
       propC: {
         type: String,
         required: true
       },
       // a number with default value
       propD: {
         type: Number,
         default: 100
       },
       // object/array defaults should be returned from a
       // factory function
       propE: {
         type: Object,
         default: function () {
           return { message: 'hello' }
         }
       },
       // custom validator function
       propF: {
         validator: function (value) {
           return value > 10
         }
       }
     }
   })
   

   I added a sample storybook vuejs project here in case someone wants to try. Would be great to find way to support smart knobs in vue.

   👍React with 👍4Reacted by Filipp Riabchun, JimmyLv_吕立青, James Dawson and Morgan McCollum
4. elevatebart commented on May 1, 2020

   

   elevatebart

   on May 1, 2020

   More actions

   @ndelangen is it still a project in the works?
   Should I start putting together a PR based on vue-docgen-api?
5. shilman commented on May 2, 2020

   

   shilman

   on May 2, 2020

   Contributor

   More actions

   @elevatebart Storybook 6.0 includes Args, which will replace knobs at some point in the 6.x cycle.

   I just added automatic args-based controls for Vue in this PR:

   https://docs.google.com/document/d/1Mhp1UFRCKCsN8pjlfPdz8ZdisgjNXeMXpXvGoALjxYM/edit#heading=h.6mdg0tp8crgj

   Knobs is widely used, so improving smart-knobs will benefit everybody who prefers that API, or is stuck using it. Helping out with Args for Vue would also be a useful way to contribute!