question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Is it possible to inherit/extend a core field?

See original GitHub issue

Hello, my question is if it’s possible to inherit(using extends) for example the fieldSelect just to include something in its templatе? I don’t want to just copy the whole field code and modify it for my needs and use it as a custom field. I think it would be possible if we could import the fieldsComponents themselves. Right now in my opinion only the abstractField mixin is exposed and used when defining custom fields, but that is not my case.

My problem with copying the fieldSelect and using it as custom field is that when at some point a newer version of vue-form-generator fixes something or improves the component, my copy of it has to be maintained by me and manually updated to incorporate the fixes or improvements.

Any thoughts on this @icebob?

Issue Analytics

  • State:closed
  • Created 6 years ago
  • Comments:16 (8 by maintainers)

github_iconTop GitHub Comments

2reactions
cristijoracommented, Jun 29, 2017

Maybe simpler alternatives such as adding component names exporting fields in a separate file //input field

export default{
name:'vfgFieldInput'
}

//fields index file

export default {Input, Checkbox} etc 
install(Vue,options) {
     Vue.component("VueFormGenerator", module.exports.component);
     if(option.fields){
       fields.forEach((field)=>{
         Vue.component(field.name,field);
       })
     }
}

Usage:

import VFG from 'vue-form-generator'
import {Input, Checkbox, AutoComplete} from 'vue-form-generator/fields'
Vue.use(VFG, [Input,Checkbox,Autocomplete])

To me this seems more usable and controllable (in terms of size because webpack does tree-shaking if you do partial imports) rather than installing a new field with npm. Npm packages as fields might be a good idea for direct script includes if you don’t need the whole vfg

2reactions
cristijoracommented, Jun 27, 2017

@Vacilando If you’re using pug you can actually do that via Vue.extends and extend templates http://vuejsdevelopers.com/2017/06/11/vue-js-extending-components/ If not you can extend the component only and copy the template part from the original vfgField and modify it how you want

Read more comments on GitHub >

github_iconTop Results From Across the Web

Guide to Inheritance in Java - Baeldung
One of the core principles of Object-Oriented Programming – inheritance – enables us to reuse existing code or extend an existing type.
Read more >
How To Extend Classes with Angular Component Inheritance
Learn how to use the power of inheritance to extend your Angular components with common functionality.
Read more >
How to extend / inherit components? - angular - Stack Overflow
When you inherit a Component, all logic inside is equally inherited. It is worth noting that only public members are inherited as private...
Read more >
Inheritance in Java, Part 1: The extends keyword - InfoWorld
Java supports single inheritance through class extension, in which one class directly inherits accessible fields and methods from another ...
Read more >
Inheritance | Microsoft Learn
Inheritance in C# enables you to create new classes that reuse, extend, and modify the behavior defined in other classes.
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found