一、下载amis
方式一:git下载sdk.tar.gz,https://github.com/baidu/amis/releases
方式二:npm i amis 来下载,在 node_modules\amis\sdk 目录里就能找到
二、把下载的amis目录复制到public/lib目录下
三、index.html加入引用
<!--amis--> <linkrel="stylesheet"href="./lib/amis/sdk/sdk.css"> <linkrel="stylesheet"href="./lib/amis/sdk/helper.css"> <linkrel="stylesheet"href="./lib/amis/sdk/iconfont.css"> <scriptsrc="./lib/amis/sdk/sdk.js"></script> 四、新建一个vue模板<template>
<div ref="box" style="text-align: center; font-size: 24px; font-weight: 700; margin-bottom: 20px">
基本信息
</div>
</template>
<script>
export default {
mounted() {
const amis = amisRequire('amis/embed')
const amisScoped = amis.embed(this.$refs.box, {
type: 'page',
title: '表单页面',
body: {
type: 'form',
mode: 'horizontal',
api: '/saveForm',
body: [
{
label: 'Name',
type: 'input-text',
name: 'name'
},
{
label: 'Email',
type: 'input-email',
name: 'email'
}
]
}
})
}
}
</script>
标签:集成,vue,name,amis,type,email,下载 From: https://www.cnblogs.com/robots2/p/17115326.html