Vuejs2 在VueJS中使用HTML数据列表元素？不能使用超链接？

我尝试使用HTML的datalist[元素，而不是自动完成库。我尝试在post.title周围包装一个a href元素

不幸的是，看起来这在datalist的option元素中是不可能的

这是我的模板：

有人有办法吗？谢谢你的朋友。 如果你想检查的话。 当做 给你

新Vue{ el:应用程序， 资料{ 返回{ 员额：[] } }, 创造{ 这是getPosts }, 方法：{ getPosts{ axios .gethttps://jsonplaceholder.typicode.com/posts .thenresponse=>{ console.logresponse； this.posts=response.data； } .catcherror=>{ console.logerror； }; } } }

---

好吧，看来我是想在这里重新发明轮子……只需要找到一个好的Vue自动完成脚本。

<input v-model='post' type='text' list='posts'>
        <datalist id='posts'>
            <option v-for='post in posts' :key='post.id'>
                <a :href='url + `${post.id}`'>{{post.title}}</a>
            </option>
        </datalist>

import axios from "axios";
export default {
  name: "SearchBar",
  data() {
    return {
      post: "",
      posts: [],
      url: "https://jsonplaceholder.typicode.com/posts/",
      //placeholder: "Search or jump to item"
    };
  },
  created() {
    this.getPosts();
  },
  methods: {
    getPosts() {
      axios
        .get("https://jsonplaceholder.typicode.com/posts")
        .then(response => {
          console.log(response);
          this.posts = response.data;
        })
        .catch(error => {
          console.log(error);
        });
    }
  }
};