hbuilder民宿网站制作代码

由于民宿网站的制作涉及到前端、后端、数据库等多方面知识，所以无法提供完整的代码。以下是一个简单的基于Vue.js和Node.js的民宿网站制作代码示例，仅供参考：

前端代码：

<template>
  <div>
    <h1>民宿网站</h1>
    <div v-for="room in rooms" :key="room.id">
      <h2>{{ room.name }}</h2>
      <p>{{ room.description }}</p>
      <button @click="book(room.id)">预订</button>
    </div>
  </div>
</template>

<script>
export default {
  data() {
    return {
      rooms: [],
    };
  },
  mounted() {
    fetch('/api/rooms')
      .then((response) => response.json())
      .then((data) => {
        this.rooms = data;
      });
  },
  methods: {
    book(id) {
      fetch(`/api/book?id=${id}`, { method: 'POST' })
        .then((response) => response.json())
        .then((data) => {
          alert(data.message);
        });
    },
  },
};
</script>

后端代码：

const express = require('express');
const bodyParser = require('body-parser');
const app = express();
const port = 3000;

let rooms = [
  { id: 1, name: '房间1', description: '描述1' },
  { id: 2, name: '房间2', description: '描述2' },
];

app.use(bodyParser.urlencoded({ extended: false }));
app.use(bodyParser.json());

app.get('/api/rooms', (req, res) => {
  res.json(rooms);
});

app.post('/api/book', (req, res) => {
  const id = req.query.id;
  // 根据id预订房间
  res.json({ message: '预订成功' });
});

app.listen(port, () => {
  console.log(`Server listening at http://localhost:${port}`);
});

以上代码仅为示例，实际开发中需要根据具体需求进行调整和优化。