```html
<div class="demo-block" id="cell-demo1">
  <lx-group>
    <lx-cell
      title="My Account"
      value="Protected"
      primary="content"
      is-link
    ></lx-cell>
  </lx-group>

  <lx-group title="use is-link to show arrow">
    <lx-cell
      title="Notifications"
      is-link
    ></lx-cell>
    <lx-cell
      title="Privacy"
      is-link
    ></lx-cell>
    <lx-cell
      title="General"
      is-link
    >
      <img
        slot="icon"
        width="20"
        style="display:block;margin-right:5px;"
        src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAC4AAAAuCAMAAABgZ9sFAAAAVFBMVEXx8fHMzMzr6+vn5+fv7+/t7e3d3d2+vr7W1tbHx8eysrKdnZ3p6enk5OTR0dG7u7u3t7ejo6PY2Njh4eHf39/T09PExMSvr6+goKCqqqqnp6e4uLgcLY/OAAAAnklEQVRIx+3RSRLDIAxE0QYhAbGZPNu5/z0zrXHiqiz5W72FqhqtVuuXAl3iOV7iPV/iSsAqZa9BS7YOmMXnNNX4TWGxRMn3R6SxRNgy0bzXOW8EBO8SAClsPdB3psqlvG+Lw7ONXg/pTld52BjgSSkA3PV2OOemjIDcZQWgVvONw60q7sIpR38EnHPSMDQ4MjDjLPozhAkGrVbr/z0ANjAF4AcbXmYAAAAASUVORK5CYII="
      >
    </lx-cell>
  </lx-group>

  <lx-group title="use flex-star">
    <lx-cell
      title="General"
      :bd-start="bdStart"
      is-link
    >
      <img
        slot="icon"
        width="20"
        style="display:block;margin-right:5px;"
        src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAC4AAAAuCAMAAABgZ9sFAAAAVFBMVEXx8fHMzMzr6+vn5+fv7+/t7e3d3d2+vr7W1tbHx8eysrKdnZ3p6enk5OTR0dG7u7u3t7ejo6PY2Njh4eHf39/T09PExMSvr6+goKCqqqqnp6e4uLgcLY/OAAAAnklEQVRIx+3RSRLDIAxE0QYhAbGZPNu5/z0zrXHiqiz5W72FqhqtVuuXAl3iOV7iPV/iSsAqZa9BS7YOmMXnNNX4TWGxRMn3R6SxRNgy0bzXOW8EBO8SAClsPdB3psqlvG+Lw7ONXg/pTld52BjgSSkA3PV2OOemjIDcZQWgVvONw60q7sIpR38EnHPSMDQ4MjDjLPozhAkGrVbr/z0ANjAF4AcbXmYAAAAASUVORK5CYII="
      >
    </lx-cell>
  </lx-group>

  <lx-group>
    <lx-cell
      title="Notifications"
      value="Enabled"
    ></lx-cell>
  </lx-group>

  <lx-group title="use slot for complexed content">
    <lx-cell
      title="slot content"
      :bd-start="bdStart"
    >
      <div slot="value">
        <span style="color: green">Hi, I'm Vux.</span>
      </div>
    </lx-cell>
  </lx-group>

  <lx-group title="isLink is set to true when link exists">
    <lx-cell
      title="Go to Radio"
      link="/component/radio"
      inline-desc="link=&quot;/component/radio&quot;"
    ></lx-cell>
    <lx-cell
      title="Go to Demo"
      :link="{path:'/demo'}"
      inline-desc=":link={path:&quot;/demo&quot;}"
    ></lx-cell>
    <lx-cell
      title="http link"
      link="https://vux.li"
      inline-desc="link=&quot;https://vux.li&quot;"
    ></lx-cell>
  </lx-group>
</div>

<script>
// Cell布局控件.md
new Vue({
  el: '#cell-demo1',
  data: {
    bdStart: true
  }
})
</script>