<div class="mod_copyright"> <p class="mod_copyright_links"> 关于我们 | 联系我们 | 联系客服 | 商家入驻 | 营销中心 | 手机品优购 | 友情链接 | 销售联盟 | 品优购社区 | 品优购公益 | English Site | Contact U </p> <p class="mod_copyright_info"> 地址:北京市昌平区建材城西路金燕龙办公楼一层 邮编:100096 电话:400-618-4000 传真:010-82935100 邮箱: zhanghj+itcast.cn <br> 京ICP备08001421号京公网安备110108007702 </p> </div>将代码改成组件,把数据放在data中
时间: 2024-02-10 14:15:16 浏览: 138
<div class="top">我的网页设计作业</div>
如果你是在Vue.js中使用该组件,可以将该段代码封装为一个组件:
```html
<template>
<div class="copyright">
<p class="copyright-links">
关于我们 | 联系我们 | 联系客服 | 商家入驻 | 营销中心 | 手机品优购 | 友情链接 | 销售联盟 | 品优购社区 | 品优购公益 | English Site | Contact Us
</p>
<p class="copyright-info">
地址:{{ address }} 邮编:{{ zipCode }} 电话:{{ phone }} 传真:{{ fax }} 邮箱: {{ email }} <br> {{ icpCode }} {{ safetyCode }}
</p>
</div>
</template>
<script>
export default {
name: 'Copyright',
data() {
return {
address: '北京市昌平区建材城西路金燕龙办公楼一层',
zipCode: '100096',
phone: '400-618-4000',
fax: '010-82935100',
email: 'zhanghj+itcast.cn',
icpCode: '京ICP备08001421号',
safetyCode: '京公网安备110108007702'
}
}
}
</script>
<style scoped>
/* 样式 */
</style>
```
然后在Vue组件中使用该组件即可。注意,这里的样式需要根据实际情况进行定义。
阅读全文