[Vuejs]-Vue. Change the contents of one slot from another

Hi you can do it with Scoped Slot. I have created an example for you how to do it. Please not that I am using v-slots(Some context here) only usable from vue v2.6.

Please take a look at the code example: https://codesandbox.io/s/2030jo20j0?fontsize=14

Child Component

    <template>
      <div>
        <div>
          <slot name="msgSlot">{{msg}}</slot>
        </div>
        <br>
        <slot name="bottom" :updateMsg="updateMsg"></slot>
      </div>
    </template>
    
    <script>
    export default {
      name: "HelloWorld",
      data: () => ({
        msg: "Default Message"
      }),
      methods: {
        updateMsg(text) {
          this.msg = text;
        }
      }
    };
    </script>

Parent Component

    <template>
      <div id="app">
        <HelloWorld>
          <template v-slot:msgSlot></template>
          <template v-slot:bottom="{updateMsg}">
            <input type="text" v-model="msg">
            <button @click="updateMsg(msg)">Change Msg</button>
          </template>
        </HelloWorld>
      </div>
    </template>
    
    <script>
    import HelloWorld from "./components/HelloWorld";
    
    export default {
      name: "App",
      data: () => ({
        msg: ""
      }),
      components: {
        HelloWorld
      }
    };
    </script>