用hbuilderx的vue上如何实现按键点击后将输入的信息永久保存在该页面上

要在Vue中实现按键点击后将输入的信息永久保存在该页面上，可以使用以下步骤：

1. 首先，在Vue组件的data属性中定义一个用于保存输入信息的变量。例如，我们可以定义一个名为`inputText`的变量。

export default {
  data() {
    return {
      inputText: '', // 用于保存输入信息的变量
    };
  },
};

2. 在模板中，使用`v-model`指令将输入框与`inputText`变量进行绑定，以实时更新输入的信息。

<template>
  <div>
    <input v-model="inputText" type="text" />
    <button @click="saveInput">保存</button>
  </div>
</template>

在上述模板代码中，我们使用`v-model`将输入框与`inputText`变量进行双向绑定。

3. 在Vue组件的methods属性中定义一个保存输入信息的方法。该方法将会在点击保存按钮时被调用，并将`inputText`的值保存到另一个变量中，例如`savedText`。

export default {
  data() {
    return {
      inputText: '',
      savedText: '',
    };
  },
  methods: {
    saveInput() {
      this.savedText = this.inputText;
    },
  },
};

在上述代码中，我们定义了一个`saveInput`方法，将`inputText`的值保存到`savedText`变量中。

4. 最后，在模板中显示保存的信息。

<template>
  <div>
    <input v-model="inputText" type="text" />
    <button @click="saveInput">保存</button>
    <p>已保存的信息：{{ savedText }}</p>
  </div>
</template>

在上述模板代码中，我们通过插值表达式`{{ savedText }}`将保存的信息显示在页面上。

通过以上步骤，当用户在输入框中输入信息并点击保存按钮时，输入的信息会被保存在`savedText`变量中，并在页面上显示出来。请根据你的实际情况修改代码。