Typescript vue Object is possibly 'null'

Question

I have already checked the questions of the past, but I could not find a solution that worked for me.

I am using Vue Typescript:

export default Vue.extend({

    data() {
      return {
        ...
        selectedOrder: null,
      };
    },



approveOrder() {
        if(this.selectedOrder !== undefined && this.selectedOrder!==null && this.selectedOrder !== '') {
          let uri = 'http://localhost:8081/v1/order/approve/';

          uri = uri + this.selectedOrder.processInstanceId + '?approverId=' + this.getUser;

Error I get is:

164:21 Object is possibly 'null'.
    162 |           let uri = 'http://localhost:8081/v1/order/approve/';
    163 |
  > 164 |           uri = uri + this.selectedOrder.processInstanceId + '?approverId=' + this.getUser;
        |                     ^

then I get error: property 'processInstanceId' does not exist on type 'string'. — farahm
– farahm, Commented Jan 8, 2020 at 12:47
no, still Property 'processInstanceId' does not exist on type 'string'. — farahm
– farahm, Commented Jan 8, 2020 at 12:53

Christian Carrillo · Accepted Answer · 2020-01-08 13:17:56Z

2

u are not using using the advantages of typescript, i guess you should set any type to your selectedOrder object, you could try as bellow:

// selectedOrder.interface.ts
interface selectedOrder {
    processInstanceId: Number;
}

in your vue component you should to import your interface file, then:

// component.vue
export default Vue.extend({
    data() {
      return {
        ...
        selectedOrder: { processInstanceId: 0 } as selectedOrder,
      };
    },
    ...
})

answered Jan 8, 2020 at 13:17

Christian Carrillo

2,7612 gold badges11 silver badges15 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

farahm Over a year ago

I rather did : ` selectedOrder: { processInstanceId: '', declineMessage: '' },` is that bad? its working this way too

Christian Carrillo Over a year ago

if you will do it like so then is not neccesary TS.

Collectives™ on Stack Overflow

Typescript vue Object is possibly 'null'

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related