Question

我有一个输入框，用户必须在其上提供其Facebook用户ID，因此我将输入框设置为默认值https://www.facebook.com，然后用户提供其用户配置文件链接，它将更新数据，但我得到了在输入框上键入任何内容时都会出现此错误

<div class="column">
  <label class="label">Facebook Id::</label>
  <input class="input is-medium" type="text" v-model="'https://www.facebook.com/'+data.fblink">
</div>

<script>
    import contactInfo from './ContactInfo'

    export default {
        components: {contactInfo},
        props: ['data'],

Answer 1

绑定仅适用于变量，使用它可以正常工作

<div class="column">
  <label class="label">Facebook Id::</label>
  <input class="input is-medium" type="text" v-model="facebook_link">
</div>

在数据变量中，将facebook_link添加为字符串。然后，如果您要更新，请使用此

'https://www.facebook.com/'+facebook_variable

Answer 2

v-model需要绑定的变量，而不是固定的字符串。

...
 <input v-model="fbProfileLink"/>
...

export default {
    components: {contactInfo},
    props: ['data'],
    data() {
      return {
        fbProfileLink: 'https://www.facebook.com/'
      }
    }
}

但是，如果您要对该链接进行任何请求，则可能不应该让用户自由地对其进行操作，而要采取适当的防护措施，这样您就不会盲目地向用户提供的URL进行请求。

vuejs“ TypeError：无法使用'in'运算符进行搜索

2 个答案: