undefinedfix
Sign in

On the parameters of components in Vue

feckless edited in Wed, 03 Aug 2022

For example, a very simple problem of a parent component controlling the display and hiding of a self component, there are two methods: 1. The parent component defines the display and hiding parameters of the child component, and then. Sync is passed in, and the child component uses prop Get the parameters from the parent component to control the display and hide. Then I can control the display and hide of the child component by controlling the change of parameters in the parent component. 2. The parent component is not defined. Define the display and hide parameters in the child component. Set a show method in the child component to change the value. Then, when it is used, the parent component uses ref to call this method to control the display and hide of the child component. Now I have too many parameters defined in the parent component, which makes me feel a bit confused, so I prefer the second method. I ask the boss to point out the advantages and disadvantages of the two methods.

2 Replies
pcapp
commented on Wed, 03 Aug 2022

Hello, I'm just learning Vue, but I don't know your question yet. Here's a question JS:

Vue.component('Father', {
    template: '#father',
    data(){
      return {money:1000}
    },
  });
  new Vue({
    el: '.app',
  })

html :

<div class="app">
    <Father></Father>
  </div>
  <template id="father">
    <div>
      <h3>66</h3>
    </div>
  </template>

My question is

  1. There is no problem with template giving ID, but an error will be reported if you give class = "father". Why?
  2. Why doesn't El report an error to the class selector
blwqh
commented on Wed, 03 Aug 2022

If the parent component and the child component only have a value such as show true / false to pass, there is no better way to say between them. But in another scenario, if the parent component passes two values to the child component, one is show, the other is URL, and other types not limited to Boolean values, in this case, props is not easy to use, because if the URL you pass twice is the same, the child group You can't receive it the second time

lock This question has been locked and the reply function has been disabled.