Component cannot access to data that starts with $_mixinname_

Question

I made some components with mixins.

mixin1.vue

export default {
  data(){
     return {
      $_mixin1_data1 : 'data1',
      data2 : 'data2'
     }
  },
  methods:{
    $_mixin1_method1(){
    
    }
  }
}

Parent.vue

import mixin1 from './mixin1';

export default {
  name : 'Parent',
  mixins:[mixin1],
  data(){
    return {
      parent1 : 'parent1'
    }
  },
  mounted(){
    console.log(this.parent1); // parent1
    console.log(this.$_mixin1_data1) //undefined
    console.log(this.data2); //data2
  }
}

When I use Parent component with mixin1 component, Parent component could not find data that starts with $. But "data2" data and the method that starts with $ is worked. I don't know why the data that starts with $_ isn't detected. I might not understand Vue's concept. Thanks for your reply.

Answer 1

Docs

Vue uses a $ prefix when exposing its own built-in APIs via the component instance. It also reserves the prefix _ for internal properties. You should avoid using names for top-level data properties that start with either of these characters.

Answer 2

Given is for setting up state
When is for doing something
Then is for evaluating results

In English at least tense differentiates

Given - past tense
When - present tense
Then - future tense

Generally When's are going to be done inefficiently.

With a UI a When will involve a browser interaction. Often a Given that does the same thing can be done more efficiently without that browser interaction. With an API the When will be done by a request/response cycle. Again a Given can do the same thing without the request/response.

For example consider adding the behaviour registration. First you would do

When 'I register' do
  fill_in name, with: "Fred"
  ...
  submit_form
end

But for you given you might do

Given 'I am registered' do
  User.create(
    name: "Fred"
    ...
  end
end

which is much much faster.

You will use When I register only a few times in your application

You will use Given I am registered (in some form or other) for almost every user interaction you write a scenario for.

For the above example the Then is

Then 'I should be registered' do
  # check UI for proof or registration
end

So Given's, When's and Then's are not only different in their context and tense, but also they are different in their implementations and their frequency of use.

The idea that a Given could be identical to a When or Then just reflects a lack of understanding and precision in your use of language for your scenarios and code for the implementation of your step definitions.

Of course you are allowed to write Cukes without this precision and control, but you don't need to, and you will gain alot if can write precisely enough that you never have to worry about the difference between a Given, When or Then

Caveats: Answer is opinionated, but question is an excellent one in my opinion. All code and examples are Ruby. All the examples are crude and simplistic. Putting lots of code in step def and calling the database directly in test code is poor practice.