Binding a custom type within inspector

Binding a custom type within inspector
0

Hello,

I am trying to bind (two way) a data from the inspector package into a custom component like this:

inspector.js

Vue.component ('inspector', {
  template: `
  
  <ui-input v-value="target.myNum.value"></ui-input>

  <p>Colors</p>
  <template v-for="color in nodeTarget.colors.attrs.default">
    <p>{{color.color._val}}</p>
    <ui-input v-value="color.right"></ui-input>
  </template>
  {{displayColors}}

  `,
  data: function () {
    return {
      nodeTarget: this.target
    }
  },
  computed: {
    // a computed getter
    displayColors: function () {
      // `this` points to the vm instance
      console.log('this.target',this.target);
      console.log('this',this);
      Editor.Ipc.sendToMain('test:foo-bar', 'Hello, this is simple panel');
      //return this.target.colors.attrs.default
    }
  },
  props: {
    target: {
      twoWay: true,
      type: Object
    },
  },
});

my component (inspector-test.ts):

const {ccclass, property, inspector} = cc._decorator;

@ccclass("Gradient")
class Gradient {
    @property()
    color: cc.Color = cc.Color.BLACK;

    @property({ slide: true, range: [0, 10, 1] })
    right: number = 0;

};

@ccclass
@inspector("packages://test/inspector.js")
export default class tester extends cc.Component {


    @property([Gradient])
    colors: Array<Gradient> = [{
        color:cc.Color.BLACK,
        right:10
    },{
        color:cc.Color.BLACK,
        right:15
    }]  //new Array<Gradient>();

    @property()
    _myNum: number = 0;
    @property()
    get myNum(){
        return this._myNum;
    }
    set myNum(value:number) {
        this._myNum = value;
        console.log('ok')
        this.node.y = value;
    }

    start () { 
        console.log('10',this.colors);
    }
    
}
 

What am I doing wrong here?

@jare @slackmoehrle
It is actually a good question indeed. Any chance you can explain how to implement an array of prefab or an array of an object?

Or maybe in short: How to deal with array with a simple v-prop?