<template #header>

`<template #header>` 是Vue.js模板系统的语法，它表示一个名为 "header" 的局部模板。在Vue组件中，你可以使用这种标签定义一个独立的部分，然后在需要的地方通过插值或指令引用这个模板。每当这部分模板的内容发生变化时，引用它的部分也会实时更新。例如：

<template>
  <div id="app">
    <header v-bind:title="pageTitle"> <!-- 使用插值表达式动态绑定标题 -->
      <h1>{{ headerTitle }}</h1>
    </header>
    <content>
      <p>This is the main content.</p>
    </content>
    <template #header> <!-- 定义了一个局部模板 -->
      <button @click="showModal">Click me</button>
    </template>
    <modal v-if="showModal">...</modal>
  </div>
</template>

<script>
export default {
  data() {
    return {
      pageTitle: 'My App',
      headerTitle: 'Welcome',
      showModal: false,
    };
  },
  // ...
};
</script>

在这个例子中，`#header` 可以单独复用或者嵌套在其他地方，提高了代码的模块性和可维护性。